<template>
  <div class="examAnswer c-p c-contexty-scroll c-bg-sgray" :class="[theme, cfg.isCopyPicture == 0 ? 'closeBig' : 'aCloseBig', cfg.isCopy == 0 ? 'copyNot' : '']">
    <watermark
      v-if="showExamWatermark"
      :watermarkContent="examWatermarkConfig && examWatermarkConfig.contentType == 2 ? examWatermarkConfig.content : ''"
      :fontSize="examWatermarkConfig && examWatermarkConfig.size ? examWatermarkConfig.size : 14"
      :contentFillStyle="examWatermarkConfig && examWatermarkConfig.color ? examWatermarkConfig.color : '#999999'"
      :opacityNum="examWatermarkConfig ? examWatermarkConfig.transparent / 100 : 0.3"
    ></watermark>
    <div>
      <audio
        id="audio"
        preload="auto"
        @error="playAudioError"
        @ended="playAudioEnd"
        @onPlayTimeChange="onPlayTimeChange"
        :curPlayTime="audioPlayTime"
        class="c-pf c-p-l-100"
      ></audio>
      <audio
        id="ancyaudio"
        preload="auto"
        @error="ancyPlayAudioError"
        @ended="ancyPlayAudioEnd"
        @onPlayTimeChange="ancyOnPlayTimeChange"
        :curPlayTime="ancyaudioPlayTime"
        class="c-pf c-p-l-100"
      ></audio>
      <audio id="audioSelf" @ended="playAudioSelfEnd" class="c-pf c-p-l-100"></audio>
      <countdown
        ref="startAnimation"
        v-if="showStart"
        @hideCountdown="hideCountdown"
      ></countdown>
      <div v-show="!showStart" v-if="questionInfo != null" class="c-pb30">
        <div class="c-bg-white c-br-br16 c-br-bl16">
          <div class="c-bd-b16-f5">
            <div class="c-ph24 ">
              <div
                class="c-flex-row c-aligni-center c-fs24 c-hh88 c-fc-xblack c-justify-sb"
              >
                <!-- 时间 -->
                <div
                  class="c-flex-row c-aligni-center c-ph10 c-pv5 c-br8"
                >
                  <span
                    v-if="
                      questionInfo.paperInfo && questionInfo.paperInfo.isStop != -1
                    "
                    class="iconfont c-pr20 c-fs32 c-fc-black"
                    @click="clickPause"
                  >&#xe7a7;</span
                  >
                  <span class="c-fc-black c-fs28">{{ answerTime }}</span>
                </div>

                <div class="c-flex-row c-aligni-center">
                  <span class="c-fc-gray c-fs24"
                  ><b class="theme-fc c-fw-n c-fs28">{{
                    questionInfo.paperInfo &&
                      testPaperType == 2
                      ? questionInfo.nowNumber
                      : questionInfo.number
                  }}</b>/{{ questionInfo.wholeNum }}</span
                  >
                  <div class="c-fc-sgray c-fs24 c-ml16" v-if="!(questionInfo.enablePreview==1&&testPaperType !=2)">|</div>
                  <div v-if="!(questionInfo.enablePreview==1&&testPaperType !=2)"
                    @click="clickNextQuestion(3, 1)"
                    class="theme-fc c-fs24 c-ml16 c-textAlign-c c-br24"
                  >
                    交卷
                  </div>
                </div>

              <!-- <div @click="getAnswerSheet(1)" v-if="questionInfo.enablePreview==1&&testPaperType !=2" class="iconfont c-fs32 c-fc-xblack">&#xe7ad;</div> -->
              </div>
            </div>
            <div class="time-bg-bar" v-if="enableLimitTime != -1">
              <div class="time-bar" :style="{ width: timeProcess + '%' }"></div>
            </div>
          </div>
          <div class="c-flex-row c-aligni-center c-ph24 c-pt30 c-justify-sb" :class="questionInfo.qTypeRemarks&&questionInfo.number2==1?'c-pb16':
            (questionInfo.resourceType == 1||questionInfo.resourceType == 2)&&
            questionInfo.resourceUrl != ''?'c-pb12':'c-pb4'">
            <div class="c-fs28 c-fc-xblack c-flex-grow1 c-fw-b c-maxw456 c-text-ellipsis1">
              {{questionInfo.questionTypeName}}
            </div>
            <div
              v-if="isFeedback == 0&&questionInfo.status!=-1"
              class="c-fc-xblack c-bg-sgray c-br20 c-fs22 c-textAlign-c c-pv8 c-ph20"
              @click="wrongFeedback"
            >
              错题反馈
            </div>
            <div
              v-if="isFeedback == 1||questionInfo.status==-1"
              class="c-fc-xblack c-bg-sgray c-br20 c-fs22 c-textAlign-c c-pv8 c-ph20"
            >
              {{questionInfo.status==-1?'错题反馈':'已反馈'}}
            </div>
          </div>
          <div v-if="questionInfo.qTypeRemarks&&questionInfo.number2==1" class="c-ph24 c-fc-gray c-fs22 c-pb4">{{questionInfo.qTypeRemarks}}</div>
          <div v-show="questionInfo.status!=-1&&questionInfo.problem">
            <div class="c-pb30" style="box-shadow: 0px 4px 18px 0px rgba(0,0,0,0.03);" v-if="(questionInfo.resourceType == 1||questionInfo.resourceType == 2)&&
              questionInfo.resourceUrl != ''">
              <!-- 视频题 -->
              <div
                class="c-fs28 c-fc-xblack c-ph24 c-pb24"
                v-if="(questionInfo.resourceType == 1||questionInfo.resourceType == 2)&&
                  questionInfo.resourceUrl != ''"
              >
                欣赏下面片段作答 。
              </div>
              <section
                v-show="
                  questionInfo.resourceType == 1 &&
                    questionInfo.resourceUrl != ''
                "
                class="c-hh360 c-ph24 c-p c-pz99"
              >
                <div id="liveVideoIntroParent" class="c-w100-im"></div>
                <div
                  v-show="!playing"
                  class="c-pa c-p-l0 c-p-t0 c-p-r0 c-h c-flex-row c-aligni-center c-justify-center c-mh24 c-pz100 c-bg-black c-pz100"
                  @click="Videoplay"
                >
                  <span class="iconfont c-fc-white c-fs100">&#xe869;</span>
                </div>
                <div
                  class="c-p-l0 c-pa c-ph16 c-p-t0 c-w100 c-h c-pz100"
                  v-if="questionInfo.assetStatus == -1"
                >
                  <div class="c-br8 c-translucent-balck60 c-w100 c-h">
                    <div class="iconfont c-fc-white c-fs108 c-textAlign-c c-pt100">
                      &#xe963;
                    </div>
                    <div class="c-fs24 c-fc-f2 c-textAlign-c">
                      该视频已被管理员删除，如有疑问请咨询客服
                    </div>
                  </div>
                </div>
              </section>
              <!-- 音频题 -->
              <section
                v-show="
                  questionInfo.resourceType == 2 &&
                    questionInfo.resourceUrl != ''
                "
                class="c-ph24"
              >
                <div class="c-bg-xgreen c-flex-row c-aligni-center c-br8 c-ph16 c-p">
                  <div class="c-mr30 c-ww54">
                    <img
                      class="c-w100"
                      src="@/assets/i/wap/exam/voice_icon.png"
                      alt=""
                    />
                  </div>
                  <div class="c-flex-grow1 c-mr48">
                    <div class="c-fc-white c-fs20 c-mt14 c-mb10 c-maxw440">
                      {{ questionInfo.resourceName }}
                    </div>
                    <vue-slider
                      class="audioPlay"
                      :height="2"
                      :processStyle="processStyle"
                      :railStyle="railStyle"
                      :dotOptions="dotOptions"
                      v-model="audioPlayTime"
                      tooltip="none"
                      :lazy="true"
                      :max="duration"
                      @drag-start="dragStart"
                      @dragging="dragging"
                      @drag-end="dragEnddragEnd"
                      @change="inputChange"
                    >
                      <template slot="dot">
                        <div class="dot-peinner c-ww22 c-hh22 c-brp50">
                          <span
                            class="c-ww22"
                            style="text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);"
                          ></span>
                        </div>
                      </template>
                    </vue-slider>
                    <div
                      class="c-flex-row c-aligni-center c-justify-sb c-fs16 c-fc-white c-mt5 c-pb15"
                    >
                      <div>{{ playtime }}</div>
                      <div>{{ playtotalTime }}</div>
                    </div>
                  </div>
                  <div
                    class="c-ww52 c-lh26 c-whiteOpcity03 c-textAlign-c c-br12 iconfont c-fs12 c-fc-white"
                    v-if="showFirstSpeak"
                    @click="firstPlay"
                  >&#xe8ed;</div>
                  <div
                    class="c-ww52 c-lh26 c-whiteOpcity03 c-textAlign-c c-br12 iconfont c-fs12 c-fc-white"
                    v-if="!showLoudspeaker && !showFirstSpeak"
                    @click="replay"
                  >&#xe8ed;</div>
                  <div
                    class="c-ww52 c-lh26 c-whiteOpcity03 c-textAlign-c c-br12 iconfont c-fs12 c-fc-white"
                    v-if="showLoudspeaker && !showFirstSpeak"
                    @click="pause"
                  >&#xe8ef;</div>
                  <div
                    v-if="questionInfo.assetStatus == -1"
                    class="c-flex-row c-aligni-center c-br8 c-ph16 c-pa c-translucent-balck60 c-p-t0 c-pz10 c-p-l0 c-w100 c-h"
                  >
                    <div class="iconfont c-fc-white c-fs40">&#xe963;</div>
                    <div class="c-fs24 c-fc-f2 c-ml16">
                      该音频已被管理员删除，如有疑问请咨询客服
                    </div>
                  </div>
                </div>
              </section>
            </div>
            <div
              class="c-ph24 c-fs28 c-pt24"
              :class="examModel == 1 && questionInfo.type==11?'c-pb40':'c-pb22'"
              v-if="questionInfo.type != 9"
            >
              <span class="fl c-lh46"
              >{{
                questionInfo.paperInfo &&
                  questionInfo.paperInfo.testPaperType &&
                  questionInfo.paperInfo.testPaperType == 2
                  ? questionInfo.nowNumber
                  : questionInfo.number2
              }}.</span
              >
              <span
                class="c-lh46 c-fs28 c-fc-xblack imgInlineb problemdDom"
                :class="[cfg.isCopyPicture == 0 ? 'closeBig' : 'aCloseBig', cfg.isCopy == 0 ? 'copyNot' : '']"
                @click="clickDesc"
                v-html="questionInfo.problem"
              ></span>
            </div>
            <div v-if="
              examModel == 2 &&
                questionInfo != null &&
                questionInfo.type == 11 &&
                !showAnalysis &&
                clickShow " class="c-pb20"
            >
              <div class="c-ph24  c-m-0auto c-mt40">
                <div v-show="!showStart" v-if='questionInfo!=null && (questionInfo.type==11)' class=" c-lh64 c-fc-white theme-bg c-fs24 c-textAlign-c c-br32" :class="showAnalysis==true?'c-fc-sgray':''" @click="showAnswer">确定</div>
              </div>
            </div>
            <div
              class="c-ph24 c-pb20"
              v-if="
                questionInfo.type == 1 ||
                  questionInfo.type == 2 ||
                  questionInfo.type == 4 ||
                  questionInfo.smallType == 1 ||
                  questionInfo.smallType == 2 ||
                  questionInfo.smallType == 4
              "
            >
              <div
                v-for="(item, index) in optionsList"
                :key="index"
                class="c-flex-row c-pv20 c-fs24 c-mh90 c-br20 c-mb24 c-ph24 c-aligni-center"
                :class="
                  optionClass[index]=='analysisUser'?'analysisUser':
                  optionClass[index]=='analysisRight'?'analysisRight':
                  optionClass[index]=='choose'?'theme-bd2 theme-bg-10':
                  'c-bd2-mgray'"
                @click.stop="clickOption(index)"
              >
                <div
                  class="op-type c-ww50 c-hh50 c-lh50 c-textAlign-c c-fw600"
                  :class="[optionClass[index]=='analysisUser'?'analysisTypeUser':
                    optionClass[index]=='analysisRight'?'analysisTypeRight':
                    optionClass[index]=='choose'?'theme-bg c-fc-white':
                    'c-bg-sgray c-fc-sblack',questionInfo.type != 2&&questionInfo.smallType != 2?'c-brp50':'c-br12']"
                >
                  {{ item.type }}
                </div>
                <div
                  class="c-pl20 c-lh50 imgInlineb c-textAlign-j problemdDom c-fc-xblack"
                  :class="[cfg.isCopyPicture == 0 ? 'closeBig' : 'aCloseBig', cfg.isCopy == 0 ? 'copyNot' : '']"
                  v-html="item.name"
                ></div>
              </div>
            </div>
            <div
              class="c-ph24 c-pb24"
              v-if="(questionInfo.type == 3 || questionInfo.smallType == 3)&&!showAnalysis"
            >
              <div class="c-w100 c-br10 c-bd1-mgray c-bg-fa c-ph20 c-pt20">
                <textarea
                  v-model="essayAnswer"
                  @focus="inputFocus"
                  @blur="inputBlur"
                  name=""
                  id="inputArea"
                  cols="30"
                  rows="10"
                  placeholder="请输入答案"
                  class="needsclick show c-fs24 c-fc-xblack c-lh40 c-w100 c-bg-fa short-answer-textarea"
                ></textarea>
                <div class="c-pt30">
                  <div class="c-flex-row c-flexw-wrap" v-if="uploadImgList.length > 0">
                    <div
                      v-for="(item, index) in uploadImgList"
                      :key="index"
                      class="c-ww160 c-hh160 c-mb24 c-flex-row c-flex-center c-p c-br10"
                      :class="index % 3 == 0 ? '' : 'c-ml20'"
                    >
                      <i @click.stop="delUploadImage(index)" class="iconfont c-fs28 del-img">&#xe757;</i>
                      <img
                        @click="clickPreviewImage(item.url)"
                        class="c-ww160 c-hh160"
                        :src="$addXossFilter(item.url)"
                        alt=""
                      />
                    </div>
                  </div>
                  <div class="c-flex-row c-flexw-wrap c-pt30" v-if="uploadAudioList.length > 0">
                    <div @click.stop="clickPlayAudio(item.url)" v-for="(item,index) in uploadAudioList" :key="index" :class="index % 3 == 0 ? '' : 'c-ml20'" class="c-ww160 c-hh60 c-br30 theme-bg c-pl24 c-pr10 c-p c-flex-row c-aligni-center c-mb30">
                      <div class="box c-ww32">
                        <div class="wifi-symbol">
                          <div class="wifi-circle first c-bd2-white"></div>
                          <div class="wifi-circle second c-bd2-white" :class="playAduioSrc == item.url?'seconAnimation':''"></div>
                          <div class="wifi-circle third c-bd2-white" :class="playAduioSrc == item.url?'thirdAnimation':''"></div>
                        </div>
                      </div>
                      <div class="c-fs20 c-fc-white">{{item.time}}"</div>
                      <i @click.stop="clickDelAudio(index)" class="iconfont c-fs28 del-img">&#xe757;</i>
                    </div>
                  </div>
                  <div class="c-flex-row c-flexw-wrap">
                    <div class="c-p c-mr60 c-pb20">
                      <div @click="clickAnswerPic" class="c-w100">
                        <i class="iconfont c-fs32 c-fc-gray">&#xe75e;</i>
                      </div>
                      <input class="c-pa c-opacity0 c-p-t0 c-p-l0 c-w100 c-hh40 c-fs10"
                        v-if="!isWeiXin"
                        :disabled="leftNumFlag?true:false"
                        ref="uploadImg"
                        name="file"
                        type="file"
                        accept="image/*"
                        @change="clickAnswerPic($event)" />
                    </div>
                    <div @click="clickAddAudio" class="c-mr60">
                      <i class="iconfont c-fs32 c-fc-gray">&#xe75b;</i>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div
              class="c-ph24 c-pb24"
              v-if="
                !showAnalysis &&
                  (questionInfo.type == 5 || questionInfo.smallType == 5)
              "
            >
              <div
                class="c-flex-row c-mb24 c-bg-F6F7F9 c-pv22 c-aligni-center c-br10"
                v-for="(item, index) in fbAnswer"
                :key="index"
              >
                <div
                  class="c-fs24 c-fc-xblack c-ph24 c-br36 c-flex-row c-flex-center c-flex-shrink0"
                >
                  {{ index + 1 }}
                </div>
                <div class="c-fc-sgray c-fs24">|</div>
                <input
                  type="text"
                  name=""
                  id=""
                  placeholder="请输入答案"
                  v-model="item.value"
                  class="c-w100 c-fs24 c-fc-xblack c-bd0 c-bg-F6F7F9 c-ml24  c-pr24"
                />
              </div>
            </div>
            <div class="" v-if="questionInfo.type == 9">
              <div
                class="c-ph24 c-pb40 c-fs28"
                style="box-shadow: 0px 5px 8px 0px rgba(0,0,0,0.03);"
              >
                <div
                  :class="
                    moreQue && showmoTest ? '' : 'c-maxh150 c-text-hidden maxMask'
                  "
                >
                  <div ref="bigProblem">
                    <span class="fl c-lh38">{{ questionInfo.number2 }}.</span>
                    <span
                      class="c-lh36 c-fs28 c-lh40 c-fc-xblack imgInlineb problemdDom"
                      :class="[cfg.isCopyPicture == 0 ? 'closeBig' : 'aCloseBig', cfg.isCopy == 0 ? 'copyNot' : '']"
                      @click="clickDesc"
                      v-html="questionInfo.bigProblem"
                    ></span>
                  </div>
                </div>
                <div
                  v-if="showmoTest"
                  class="theme-fc c-fs22 c-ww168 c-m-0auto c-mt30"
                  @click="showMoreQue"
                >
                  {{ moreQue ? "收起详情" : "展开余下详情"
                  }}<span
                    class="iconfont c-fs24 c-ml10"
                    :class="moreQue ? 'chanDeg-90' : 'chanDeg90'"
                  >&#xe635;</span>
                </div>
              </div>
              <div class="c-ph24 c-br-br16">
                <div class="c-br8" :class="showAnalysis?'':'c-pb40'">
                  <div class="c-pb32 c-fs20 c-pt30">
                    <div class="c-flex-row c-aligni-center c-justify-sb">
                      <div class="c-pv2 c-ph8 c-br4 c-ws-n c-mb20 theme-fc theme-bg-10">{{
                        questionInfo.realType == 1
                          ? "单选题"
                          : questionInfo.realType == 2
                            ? "多选题"
                            : questionInfo.realType == 3
                              ? "问答题"
                              : questionInfo.realType == 4
                                ? "判断题"
                                : questionInfo.realType == 5
                                  ? "填空题"
                                  : ""
                      }}
                      </div>
                      <span class="c-inlineblack c-pv2 c-ph8 c-fc-gray c-fs24">{{
                        questionInfo.smallNumber + "/" + questionInfo.hasSmallNum
                      }}</span>

                    </div>
                    <div>
                      <span class="fl c-lh38 c-fs28">{{questionInfo.smallNumber}}.</span><span
                        class="c-fs28 c-l40 c-fc-xblack imgInlineb problemdDom"
                        :class="[cfg.isCopyPicture == 0 ? 'closeBig' : 'aCloseBig', cfg.isCopy == 0 ? 'copyNot' : '']"
                        @click="clickDesc"
                        v-html="questionInfo.problem"
                      ></span>
                    </div>
                  </div>
                  <div
                    v-if="
                      questionInfo.realType == 1 ||
                        questionInfo.realType == 2 ||
                        questionInfo.realType == 4
                    "
                  >
                    <div
                      v-for="(item, index) in optionsList"
                      :key="index"
                      class="c-flex-row c-pv20 c-fs24 c-mh90 c-br20 c-mb24 c-ph24 c-aligni-center"
                      :class="
                        optionClass[index]=='analysisUser'?'analysisUser':
                        optionClass[index]=='analysisRight'?'analysisRight':
                        optionClass[index]=='choose'?'theme-bd2 theme-bg-10':
                        'c-bd2-mgray'"
                      @click="clickOption(index)"
                    >
                      <div
                        class="op-type c-ww50 c-hh50 c-lh50 c-textAlign-c c-fw600"
                        :class="[
                          optionClass[index]=='analysisUser'?'analysisTypeUser':
                          optionClass[index]=='analysisRight'?'analysisTypeRight':
                          optionClass[index]=='choose'?'theme-bg c-fc-white':
                          'c-bg-sgray c-fc-sblack',questionInfo.realType != 2&&questionInfo.realType != 2?'c-brp50':'c-br12']"
                      >
                        {{ item.type }}
                      </div>
                      <div
                        class="c-pl20 c-lh50 imgInlineb c-textAlign-j problemdDom c-fc-xblack"
                        :class="[cfg.isCopyPicture == 0 ? 'closeBig' : 'aCloseBig', cfg.isCopy == 0 ? 'copyNot' : '']"
                        v-html="item.name"
                      ></div>
                    </div>
                  </div>
                  <div v-if="questionInfo.realType == 3&&!showAnalysis">
                    <div class="c-w100 c-br10 c-bd1-mgray c-ph20 c-pt20 c-bg-fa">
                      <textarea
                        v-model="essayAnswer"
                        @focus="inputFocus"
                        @blur="inputBlur"
                        name=""
                        id="inputArea"
                        cols="30"
                        rows="10"
                        placeholder="请输入答案"
                        class="needsclick show c-fs24 c-fc-xblack c-lh40 c-w100 c-bg-fa short-answer-textarea"
                      ></textarea>
                      <div class="c-pt30">
                        <div class="c-flex-row c-flexw-wrap" v-if="uploadImgList.length > 0">
                          <div
                            v-for="(item, index) in uploadImgList"
                            :key="index"
                            class="c-ww160 c-hh160 c-mb24 c-flex-row c-flex-center c-p c-br10"
                            :class="index % 3 == 0 ? '' : 'c-ml20'"
                          >
                            <i @click.stop="delUploadImage(index)" class="iconfont c-fs28 del-img">&#xe757;</i>
                            <img
                              @click="clickPreviewImage(item.url)"
                              class="c-ww160 c-hh160"
                              :src="$addXossFilter(item.url)"
                              alt=""
                            />
                          </div>
                        </div>
                        <div class="c-flex-row c-flexw-wrap c-pt30" v-if="uploadAudioList.length > 0">
                          <div @click.stop="clickPlayAudio(item.url)" v-for="(item,index) in uploadAudioList" :key="index" :class="index % 3 == 0 ? '' : 'c-ml20'" class="c-ww160 c-hh60 c-br30 theme-bg c-pl24 c-pr10 c-p c-flex-row c-aligni-center c-mb30">
                            <div class="box c-ww32">
                              <div class="wifi-symbol">
                                <div class="wifi-circle first c-bd2-white"></div>
                                <div class="wifi-circle second c-bd2-white" :class="playAduioSrc == item.url?'seconAnimation':''"></div>
                                <div class="wifi-circle third c-bd2-white" :class="playAduioSrc == item.url?'thirdAnimation':''"></div>
                              </div>
                            </div>
                            <div class="c-fs20 c-fc-white">{{item.time}}"</div>
                            <i @click.stop="clickDelAudio(index)" class="iconfont c-fs28 del-img">&#xe757;</i>
                          </div>
                        </div>
                        <div class="c-flex-row c-flexw-wrap">
                          <div class="c-p c-mr60 c-pb20">
                            <div @click="clickAnswerPic" class="c-w100">
                              <i class="iconfont c-fs32 c-fc-gray">&#xe75e;</i>
                            </div>
                            <input class="c-pa c-opacity0 c-p-t0 c-p-l0 c-w100 c-hh40 c-fs10"
                              v-if="!isWeiXin"
                              :disabled="leftNumFlag?true:false"
                              ref="uploadImg"
                              name="file"
                              type="file"
                              accept="image/*"
                              @change="clickAnswerPic($event)" />
                          </div>
                          <div @click="clickAddAudio" class="c-mr60">
                            <i class="iconfont c-fs32 c-fc-gray">&#xe75b;</i>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div
                    v-if="!showAnalysis && questionInfo.realType == 5"
                  >
                    <div
                      class="c-flex-row c-mb24 c-bg-F6F7F9 c-pv22 c-aligni-center c-br10"
                      v-for="(item, index) in fbAnswer"
                      :key="index"
                    >
                      <div
                        class="c-fs24 c-fc-xblack c-ph24 c-br36 c-flex-row c-flex-center c-flex-shrink0"
                      >
                        {{ index + 1 }}
                      </div>
                      <div class="c-fc-sgray c-fs24">|</div>
                      <input
                        type="text"
                        name=""
                        id=""
                        placeholder="请输入答案"
                        v-model="item.value"
                        class="c-w100 c-fs24 c-fc-xblack c-bd0 c-bg-F6F7F9 c-ml24 c-pr24"
                      />
                    </div>
                  </div>
                  <div
                    class="c-m-0auto c-mt20 "
                    v-if="
                      examModel == 2 &&
                        questionInfo != null &&
                        (questionInfo.realType == 2 ||
                          questionInfo.realType == 3 ||
                          questionInfo.realType == 5) &&
                        !showAnalysis &&
                        clickShow
                    "
                    :class="showAnalysis == true ? 'c-fc-sgray' : ''"
                    @click="showAnswer"
                  >
                    <div class="c-lh64 theme-bg c-br32 c-fc-white c-fs24 c-textAlign-c">
                      确定
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="c-pb40"
              v-show="
                examModel == 2 &&
                  questionInfo != null &&
                  (questionInfo.type == 2 ||
                    questionInfo.type == 3 ||
                    questionInfo.type == 5 ||
                    questionInfo.smallType == 2 ||
                    questionInfo.smallType == 3 ||
                    questionInfo.smallType == 5) &&
                  !showAnalysis
              ">
              <div
                class="c-ph24 c-m-0auto c-lh50" :class="questionInfo.smallType == 2 ||questionInfo.type == 2?'':'c-mt40'"
              >
                <div
                  v-show="!showStart"
                  v-if="
                    examModel == 2 &&
                      questionInfo != null &&
                      (questionInfo.type == 2 ||
                        questionInfo.type == 3 ||
                        questionInfo.type == 5 ||
                        questionInfo.smallType == 2 ||
                        questionInfo.smallType == 3 ||
                        questionInfo.smallType == 5)
                  "
                  class="theme-bg c-lh64 c-fc-white c-fs24 c-textAlign-c c-br32"
                  :class="showAnalysis == true ? 'c-fc-sgray' : ''"
                  @click="showAnswer"
                >
                  确定
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- 我的答案 -->
        <div class="c-ph24 c-mt28 c-bg-white c-br16 c-pt24" v-if="showAnalysis">
          <div class="c-flex-row c-aligni-center">
            <img class="c-ww28 c-hh18" src="@/assets/i/wap/exam/leftAnser.png" alt="">
            <div class="c-fc-xblack c-fs26 c-fw500 c-ml10">{{questionInfo.type==11?"答案":"我的答案"}}</div>
          </div>
          <div class="c-ph24 c-mt20" v-if="showAnalysis && questionInfo.type==11">
            <div class="c-fs26 c-fc-1b c-fw-b">正确答案：</div>
            <div>
              <span class="c-fs24 c-mr10 copyNot c-fs26 c-fw-b c-fc-send-green" v-for="(item,index) in questionInfo.answer" :key="index">
                {{item.value}}{{questionInfo.answer.length-1==index?'':","}}</span>
            </div>
          </div>
          <div class="c-ph24 c-mt20 c-pb24" v-if="showAnalysis && questionInfo.type==11">
            <div class="c-fs26 c-fc-1b c-fw-b">学员答案：</div>
            <div>
              <span v-for="(item,index) in userAnswer" :key="index" :class="item.value==questionInfo.answer[index].value ? 'c-fc-send-green' : 'c-fc-reword'" class="c-fs24 c-mr10 copyNot c-fs26 c-fw-b">
                {{item.value == ''?'未答题':item.value}}{{userAnswer.length-1==index?'':","}}
              </span>
            </div>
          </div>
          <div
            v-if="showAnalysis &&(questionInfo.type <= 2 ||questionInfo.type == 4 ||(questionInfo.smallType > 0 && questionInfo.smallType <= 2) ||
              questionInfo.smallType == 4 ||
              (questionInfo.type == 9 &&
                (questionInfo.realType <= 2 || questionInfo.realType == 4)))"
            class="c-flex-row c-mt20 c-pb24">
            <div class="c-fs24 c-fc-xblack copyNot c-fs26 c-fc-1b c-fw-b">
              正确答案<b class="c-ml8 c-fc-send-green">{{
                questionInfo.type == 4 ||
                  questionInfo.smallType == 4 ||
                  questionInfo.realType == 4
                  ? questionInfo.answer == 1
                    ? "正确"
                    : "错误"
                  : questionInfo.answer
              }}</b>
            </div>
            <div class="c-fs24 copyNot c-fs26 c-fc-1b c-fw-b c-ml80">我的答案<b class="c-ml8" :class="questionInfo.realType == 4 ||questionInfo.type == 4 || questionInfo.smallType == 4
              ? (questionInfo.answer == 1 && userAnswer == '正确') ||
                (questionInfo.answer == -1 && userAnswer == '错误')
                ? 'c-fc-send-green'
                : 'c-fc-reword'
              : questionInfo.answer == userAnswer
                ? 'c-fc-send-green'
                : 'c-fc-reword'
            ">{{ userAnswer == "" ? "未答题" : userAnswer }}</b></div>
          </div>
          <div
            class="c-mt20 c-pb24"
            v-if="
              showAnalysis &&
                (questionInfo.type == 5 ||
                  questionInfo.smallType == 5 ||
                  (questionInfo.type == 9 && questionInfo.realType == 5))
            "
          >
            <div
              class="c-flex-row c-mt24 c-aligni-center"
              v-for="(item, index) in fbAnswer"
              :key="index"
            >
              <div
                class="c-fs24 c-fc-xblack c-mr8 c-flex-row c-flex-center"
              >
                {{ index + 1 }}.
              </div>
              <div class="c-fs24 c-fc-xblack c-flex-grow1 c-mr10" :class="fbAnswerStyle[index] == 'right' ? 'rightClass' : fbAnswerStyle[index] == 'wrong' ? 'c-fc-reword' : ''">
                {{ item.value.trim() == "" ? "未答题" : item.value }}
              </div>
            </div>
          </div>
          <div
            class="c-mt20 c-pb24"
            v-if="
              showAnalysis &&
                (questionInfo.type == 3 ||
                  questionInfo.smallType == 3 ||
                  (questionInfo.type == 9 && questionInfo.realType == 3))
            "
          >
            <div v-if="essayAnswer != ''&&uploadAudioList.length==0&&uploadAudioList.length==0">
              <div
                class="c-fs24 c-fc-xblack  copyNot"
              >
                {{ essayAnswer }}
              </div>
              <div class="c-flex-row c-flexw-wrap c-pt24" v-if="uploadAudioList.length > 0">
                <div @click.stop="clickPlayAudio(item.url)" v-for="(item,index) in uploadAudioList" :key="index" :class="index % 3 == 0 ? '' : 'c-ml20'" class="c-ww160 c-hh60 c-br30 theme-bg c-pl24 c-pr10 c-p c-flex-row c-aligni-center c-mb30">
                  <div class="box c-ww32">
                    <div class="wifi-symbol">
                      <div class="wifi-circle first c-bd2-white"></div>
                      <div class="wifi-circle second c-bd2-white" :class="playAduioSrc == item.url?'seconAnimation':''"></div>
                      <div class="wifi-circle third c-bd2-white" :class="playAduioSrc == item.url?'thirdAnimation':''"></div>
                    </div>
                  </div>
                  <div class="c-fs20 c-fc-white">{{item.time}}"</div>
                </div>
              </div>
              <div
                class="c-flexw-wrap c-flex-row" :class="uploadAudioList.length > 0?'':'c-pt24 '"
                v-if="uploadImgList.length > 0"
              >
                <div
                  v-for="(item, index) in uploadImgList"
                  :key="index"
                  class="c-ww160 c-hh160 c-mb30 c-flex-row c-flex-center c-p "
                  :class="index % 3 == 0 ? '' : 'c-ml20'"
                >
                  <img
                    @click="clickPreviewImage(item.url)"
                    class="c-ww160 c-hh160"
                    :src="$addXossFilter(item.url)"
                    alt=""
                  />
                </div>
              </div>
            </div>
            <div class="c-fs24 c-fc-xblack c-flex-grow1 c-mr10" v-else>
              {{ essayAnswer == ''&&uploadAudioList.length==0&&uploadAudioList.length==0 ? "未答题" : '' }}
            </div>
          </div>
        </div>
        <div class="c-ph24 c-mt28 c-bg-white c-br16 c-pt24 c-pb24" v-if=" showAnalysis &&
          (questionInfo.type == 5 ||
            questionInfo.smallType == 5 ||
            (questionInfo.type == 9 && questionInfo.realType == 5))
        ">
          <div class="c-flex-row c-aligni-center">
            <img class="c-ww28 c-hh18" src="@/assets/i/wap/exam/leftAnser.png" alt="">
            <div class="c-fc-xblack c-fs26 c-fw500 c-ml10">正确答案</div>
          </div>
          <div
            class="c-flex-row c-mt24 c-aligni-center"
            v-for="(item, index) in questionInfo.answer"
            :key="index"
          >
            <div
              class="c-fs24 c-fc-xblack c-mr8 c-flex-row c-flex-center"
            >
              {{ index + 1 }}.
            </div>
            <div class="c-fs24 c-fc-xblack c-flex-grow1 c-mr10">
              {{ item.value }}
            </div>
          </div>
        </div>
        <div class="c-ph24 c-mt28 c-bg-white c-br16 c-pt24 c-pb24" v-if="
          showAnalysis &&
            (questionInfo.type == 3 ||
              questionInfo.smallType == 3 ||
              (questionInfo.type == 9 && questionInfo.realType == 3))
        ">
          <div class="c-flex-row c-aligni-center">
            <img class="c-ww28 c-hh18" src="@/assets/i/wap/exam/leftAnser.png" alt="">
            <div class="c-fc-xblack c-fs26 c-fw500 c-ml10">正确答案</div>
          </div>
          <div class="c-fs24 c-fc-xblack c-mt14 copyNot problemdDom" @click="clickDesc" v-html="questionInfo.answer">
          </div>
        </div>
        <!-- 解析 -->
        <div class="c-ph24 c-mt28 c-bg-white c-br16 c-pt24" v-show="showAnalysis && questionInfo.isAnalysis == 1">
          <div class="c-flex-row c-aligni-center">
            <img class="c-ww28 c-hh18" src="@/assets/i/wap/exam/leftAnser.png" alt="">
            <div class="c-fc-xblack c-fs26 c-fw500 c-ml10">答案解析</div>
          </div>
          <div class="c-mt20 Analysis c-pb24">
            <div
              class="c-fs24 c-fc-xblack c-mt14 copyNot c-textAlign-j problemdDom"
              v-show="questionInfo.analysis != '' && questionInfo.analysis != ' '"
              :class="[cfg.isCopyPicture == 0 ? 'closeBig' : 'aCloseBig', cfg.isCopy == 0 ? 'copyNot' : '']"
              @click="clickDesc"
              v-html="questionInfo.analysis"
            ></div>
            <!-- 视频解析 -->
            <section v-show="questionInfo.analysisRtype==1&&questionInfo.analysisRurl!=''&&questionInfo.analysisRurl" class="c-hh360 c-p c-mt14">
              <div id="ancyVideoIntroParent" class="c-w100-im"></div>
              <div style="z-index:120" v-show="!ancyPlaying" class="c-pa c-p-l0 c-p-t0 c-p-r0 c-h c-flex-row c-aligni-center c-justify-center c-bg-black" @click="VideoplayAncy">
                <span class="iconfont c-fc-white c-fs100">&#xe869;</span>
              </div>
              <div class="c-p-l0 c-pa c-ph16 c-p-t0 c-w100 c-h c-pz1000" v-if="questionInfo.analysisAssetStatus==-1">
                <div class="c-br8 c-translucent-balck60 c-w100 c-h">
                  <div class="iconfont c-fc-white c-fs108 c-textAlign-c c-pt100">&#xe963;</div>
                  <div class="c-fs24 c-fc-f2 c-textAlign-c">该视频已被管理员删除，如有疑问请咨询客服</div>
                </div>
              </div>
            </section>
            <!-- 音频解析 -->
            <section v-show="questionInfo.analysisRtype==2&&questionInfo.analysisRurl!=''&&questionInfo.analysisRurl" class="c-mt14">
              <div class="c-bg-xgreen c-flex-row c-aligni-center c-br8 c-ph16 c-p">
                <div class="c-mr30 c-ww54"><img class="c-w100" src="@/assets/i/wap/exam/voice_icon.png" alt=""></div>
                <div class="c-flex-grow1 c-mr48">
                  <div class="c-fc-white c-fs20 c-mt14 c-mb10 c-maxw440">{{questionInfo.analysisRname}}</div>
                  <vue-slider class="audioPlay" :height="2" :processStyle="processStyle" :railStyle="railStyle" :dotOptions="dotOptions" v-model="ancyaudioPlayTime" tooltip="none" :lazy="true" :max="ancyduration"
                    @drag-start="ancydragStart" @dragging="ancydragging" @drag-end="ancydragEnddragEnd" @change="ancyinputChange">
                    <template slot="dot">
                      <div class="dot-peinner c-ww22 c-hh22 c-brp50"><span class="c-ww22" style="text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);"></span></div>
                    </template>
                  </vue-slider>
                  <div class="c-flex-row c-aligni-center c-justify-sb c-fs16 c-fc-white c-mt5 c-pb15">
                    <div>{{ancyplaytime}}</div>
                    <div>{{ancyplaytotalTime}}</div>
                  </div>
                </div>
                <div class="c-ww52 c-lh26 c-whiteOpcity03 c-textAlign-c c-br12 iconfont c-fs12 c-fc-white" v-if="ancyshowFirstSpeak" @click="ancyfirstPlay">&#xe8ed;</div>
                <div class="c-ww52 c-lh26 c-whiteOpcity03 c-textAlign-c c-br12 iconfont c-fs12 c-fc-white" v-if="!ancyshowLoudspeaker&&!ancyshowFirstSpeak" @click="ancyreplay">&#xe8ed;</div>
                <div class="c-ww52 c-lh26 c-whiteOpcity03 c-textAlign-c c-br12 iconfont c-fs12 c-fc-white" v-if="ancyshowLoudspeaker && !ancyshowFirstSpeak" @click="ancypause">&#xe8ef;</div>
                <div v-if="questionInfo.analysisAssetStatus==-1" class="c-flex-row c-aligni-center c-br8 c-ph16 c-pa c-translucent-balck60 c-p-t0 c-pz10 c-p-l0 c-w100 c-h">
                  <div class="iconfont c-fc-white c-fs40">&#xe963;</div>
                  <div class="c-fs24 c-fc-f2 c-ml16">该音频已被管理员删除，如有疑问请咨询客服</div>
                </div>
              </div>
            </section>
            <div
              class="c-fs24 c-fc-xblack"
              v-if="(questionInfo.analysis == '' || questionInfo.analysis == ' ')&&(questionInfo.analysisRurl==''||!questionInfo.analysisRurl)"
            >
              无
            </div>
          </div>
        </div>
        <loading-status-tem :showLoading="false" :noData="questionInfo.status==-1||!questionInfo.problem" :noDataText="'该题目已被删除,请联系管理员'"></loading-status-tem>
      </div>
      <div v-if="
        questionInfo != null
      " class="c-flex-row c-hh90 c-aligni-center c-bd-t1 c-pf c-p-b0 c-w100 c-maxw640 c-bg-white c-pz1000 c-pl24 c-pr24">
        <div @click="getAnswerSheet(1)" v-if="questionInfo.enablePreview==1&&testPaperType !=2" class="c-flex-column c-fs18 c-aligni-center c-justify-center c-h c-fc-sblack c-mr40">
          <div class="c-fs40 iconfont c-fc-xblack">&#xe8ad;</div>
          <div>答题卡</div>
        </div>
        <div class="c-flex-grow1 c-hh70 c-w0 c-flex-row c-aligni-center c-justify-center c-br36 c-text-hidden">
          <div class="c-flex-grow1 c-lh70  c-w0 c-textAlign-c c-fs24"
            :class="((questionInfo.type != 9 && num == 1) || (questionInfo.type == 9 && num == 1 && smallNumber == 1)) || testPaperType == 2 ? 'theme-bg-10 theme-fc c-fw-n c-fc-white c-opacity50' : 'theme-fc c-fw-n theme-bg-10'"
            @click="clickPreQuestion()"><span class="iconfont c-fs24 chanDeg  c-mr8">&#xe635;</span>上一题</div>
          <div v-if="isOver == 0" class="c-flex-grow1 c-lh70 c-w0 c-textAlign-c c-fs24 c-fc-white"
            :class="isOver||questionInfo==null||questionInfo.length==0 ? 'c-bg-gray':'theme-bg'"
            @click="clickNextQuestion(1)">下一题<span class="iconfont c-fs24 c-ml8">&#xe635;</span></div>
          <div v-if="isOver == 1" class="c-flex-grow1 c-lh70 c-w0 c-textAlign-c c-fs24 c-fc-white"
            :class="isOver||questionInfo==null||questionInfo.length==0 ? 'theme-bg':'c-bg-gray'"
            @click="clickNextQuestion(2, 1)">交卷<span class="iconfont c-fs24 c-ml8">&#xe635;</span></div>
        </div>
      </div>
    </div>
    <cust-dialog :showModal="answerShow">
      <div class="c-fs28 c-textAlign-c c-pv50 c-fw-b c-lh">答题人</div>
      <div class="c-ph30">
        <input
          placeholder="请输入答题人姓名"
          id="inputMyScailCard"
          maxlength="10"
          v-model="answerName"
          class="input-nikename c-ph24 c-w100 c-hh88 c-fs24"
        />
      </div>
      <div class="c-fs20 c-pt20 c-ph30 c-pb48  c-flex-row c-lh c-justify-sb ">
        <span class="c-fc-red">{{
          errorFlag ? "答题人姓名不能为空" : ""
        }}</span>
        <span>{{answerName?answerName.length:'0'}}{{"/" + 10}}</span>
      </div>
      <footer class="c-fs20 c-flex-row c-fs28 c-bd-t1">
        <div
          @click="cancelAnswer"
          class="c-hh88 c-flex-row c-flex-center c-flex-grow1 c-w0 c-fc-gray c-bd-r1"
        >
          取消
        </div>
        <div
          @click="onConfirmUpdate"
          class="c-hh88 c-flex-row c-flex-center c-flex-grow1 c-w0 theme-fc"
        >
          确定
        </div>
      </footer>
    </cust-dialog>
    <cj-popup v-model="showCar" :closeable="true" title="答题卡" position="bottom" @closed="hideColumnList" round>
      <!-- <open-modal class="c-pz10000" :openModal='showCar' @closeModal='hideColumnList'> -->
      <div class="c-br-tl20 c-br-tr20 c-bg-white c-ph24 c-pb100">
        <div class="c-flex-row c-fs24 c-fc-sblack c-justify-sb c-aligni-center c-pb24 c-bd-b1-f5">
          <div class="c-flex-row" v-if="examModel==2">
            <div class="c-mr48"><span class="c-inlineblack c-ww16 c-hh16 c-brp50 c-bg-reword c-mr8"></span>错误</div>
            <div class="c-mr48"><span class="c-inlineblack c-ww16 c-hh16 c-brp50 c-bg-send-green  c-mr8"></span>正确</div>
            <div class="c-mr48"><span class="c-inlineblack c-ww16 c-hh16 c-brp50  c-mr8 c-bd1-mgray"></span>待评分</div>
            <div class="c-mr48"><span class="c-inlineblack c-ww16 c-hh16 c-brp50 c-bg-sgray c-mr8"></span>未做</div>
          </div>
          <div class="c-flex-row" v-else>
            <div class="c-mr48"><span class="c-inlineblack c-ww16 c-hh16 c-brp50 c-bg-sgray c-mr8"></span>未做</div>
            <div class="c-mr48"><span class="c-inlineblack c-ww16 c-hh16 c-brp50 theme-bg  c-mr8"></span>已做</div>
          </div>
        </div>
        <div class=" c-minh50vh c-content-scroll c-mt28 c-pb20 ">
          <div>
            <div v-for="(item,index) in answerCardList" :key="index" class="c-pb28">
              <div class="c-fc-xblack c-fs24 c-fw500">
                {{item.name}}
              </div>
              <div v-if="examModel==2"><span class="c-mt28 c-fs26 c-inlineblack c-ww64 c-hh64 c-brp50  c-lh60 c-textAlign-c" v-for="(items,index) in item.questionList" @click="goQuestion(items.number,items.userAnswer)" :key="index"
                :class="[items.userAnswer?(items.isCheck ==-1?'c-bd1-mgray c-fc-sblack':
                  (items.isRight==1?'borderRight right':
                    (items.isRight==-1?'borderUser worron':'c-bd1-mgray c-bg-sgray c-fc-sblack'))):
                  'c-bg-sgray c-fc-sblack',(index+1)%5==0?'':'c-mr68']">{{items.number2}}</span></div>
              <div v-else><span class="c-mt28 c-fs26 c-inlineblack c-ww64 c-hh64 c-brp50  c-lh60 c-textAlign-c" v-for="(items,index) in item.questionList" @click="goQuestion(items.number,items.userAnswer)" :key="index"
                :class="[items.userAnswer?'theme-bg c-fc-white':'c-bg-sgray c-fc-sblack',(index+1)%5==0?'':'c-mr68',]">{{items.number2}}</span></div>
            </div>
          </div>
          <div v-if="answerCardList.length==0">
            <loading-status-tem :pt20='true' :noData="true" :noDataText="'暂无数据'"></loading-status-tem>
          </div>
        </div>
      </div>
      <div class="c-pa c-p-b0 c-bg-white c-w100 c-ph24 c-pv12 c-bd-t1-f6">
        <div @click="clickNextQuestion(3, 1)" class="c-fc-white theme-bg c-br36 c-hh76 c-flex-row c-justify-center c-aligni-center c-fs26">交卷并查看结果</div>
      </div>
    </cj-popup>
    <cj-popup v-model="isPause" :closeable="false" @closed="clickGoOn" position="center" class="c-bg-transparent" round>
      <div class="c-ww220 c-center"><img :src="require('@/assets/i/wap/exam/relex.png')" alt=""></div>
      <div class="c-bg-white c-br20 c-pt96 c-ww480 c-pb32 c-mt-t-100 c-mb100">
        <div class="c-fc-xblack c-fw600 c-fs32 c-textAlign-c">休息一下，暂停做题</div>
        <div class="c-fc-gray c-fs24 c-textAlign-c c-mt22">{{pauseText}}</div>
        <div class="c-br46 c-br40 theme-bg c-fs28 c-pv14 c-ww340 c-textAlign-c c-center c-fc-white c-mt40" @click="clickGoOn">继续做题</div>
        <div class="c-flex-row c-aligni-center c-justify-center c-mt28">
          <div class="c-fs24 c-fc-gray" @click="clickRestart">重新开始</div>
          <div class="c-fs24 c-fc-gray c-mh10">|</div>
          <div class="c-fs24 c-fc-gray" @click="clickExit">退出测试</div>
        </div>
      </div>
    </cj-popup>
    <clock-audio-record :showAudioRecordModal='showAudioRecordModal' @closeAudioRecordModal='closeAudioRecordModal' @uploadAudioSuccess='uploadAudioSuccess'></clock-audio-record>
    <div v-show="showModal" class="c-pz1002 c-w100 c-h c-pf c-p-l0 c-p-t0 c-flex-row c-flex-center">
      <div class="c-translucent-balck50 c-text-hidden c-pz-1 c-w100 c-h c-pa c-p-l0 c-p-t0" data-type="cancel" @click="closeModal"></div>
      <div class="c-ww540 c-bg-white c-flex-column c-pz1 c-br10">
        <div class="c-fs28 c-textAlign-c c-pv40 c-lh c-fc-xblack">反馈提示</div>
        <div class="c-fs26 c-ph40 c-pb20 c-fc-xblack">确认当前题目有误，反馈给老师！</div>
        <div class="c-fs26 c-ph40 c-pb20">具体描述:</div>
        <div class="c-fs26 c-ph40 c-pb20">
          <div class="c-ph10 iptClass c-br12">
            <textarea class="textarea needsclick c-lh42" v-model="errContent" :placeholder="'请在输入框输入具体描述'" :maxlength="50"></textarea>
            <div class="c-textAlign-r c-fs20 c-pb16 c-fc-gray">{{errContent.length}}/50</div>
          </div>
        </div>
        <footer class="c-flex-row c-fs28 c-bd-t1">
          <div class="c-hh74 c-flex-row c-flex-center c-flex-grow1 c-w0 c-fc-sblack c-bd-r1" @click="closeModal">取消</div>
          <div class="c-hh74 c-flex-row c-flex-center c-flex-grow1 c-w0 theme-fc" @click="onConfirmOverLive">确定</div>
        </footer>
      </div>
    </div>
    <cj-popup v-model="showSelectModal" :closeable="true" titleClass="c-bd-b1" :title="'第'+(selectIndex*1+1)+'空'" position="bottom" round v-if="questionInfo&&questionInfo.newOption">
      <div class="c-ph24 c-mt24 c-pb40">
        <div v-for="(item,index) in questionInfo.newOption[selectIndex].options" :key="index" @click.stop="clickOption(index)" :class="optionClass[index]=='choose'?'theme-bd2 theme-bg-10':'c-bd2-mgray'" class="c-flex-row c-pv20 c-fs24 c-mh90 c-br20 c-mb24 c-ph24">
          <div class="op-type c-ww50 c-hh50 c-lh50 c-textAlign-c c-fw600 c-brp50" :class="optionClass[index]=='choose'?'theme-bg c-fc-white':'c-bg-sgray c-fc-sblack'" >{{item.name}}</div>
          <div class="c-pl20 c-lh50 c-wb-ba copyNot imgInlineb c-textAlign-j problemdDom" v-html="item.content"></div>
        </div>
      </div>
    </cj-popup>
    <cj-popup v-model="showTimeEnd" :closeable="true" class="c-ww480 c-bg-transparent" @closed="closeGuidePop" round closeIconPosition='bottom-center' closeIcon="icon-buoumaotubiao20">
      <img class="c-ww480" :src="require('@/assets/i/wap/exam/time_end.png')" />
      <div class="c-bg-white c-pb40 c-pt36 c-mt-36 c-p c-br36">
        <div class="c-ph32 c-fs24 c-fc-xblack">考试已结束，您的试卷已提交 即将自动跳转到成绩查看界面 ({{timeOutNum}}s)</div>
        <div class="c-ww340 c-hh68 c-lh68 c-fs28 c-textAlign-c c-fc-white c-bg-xblue c-br36 c-mt36 c-center">查看成绩</div>
      </div>
    </cj-popup>
  </div>
</template>

<script>
//import ExaminationResult from "@/components/homePage/examination/examinationResult.vue";
import Countdown from "@/components/templates/countdown.vue";
import { utilJs, wxUtilJs } from "@/utils/common.js"
import VueSlider from "vue-slider-component";
import { getXgplayer, destoryPlayer } from "@/utils/xgplayerJs.js";
import "vue-slider-component/theme/antd.css";
import custDialog from "@/components/templates/common/custDialog.vue";
import loadingStatusTem from "@/components/templates/common/loadingStatusTem.vue";
import watermark from "@/components/templates/common/watermark.vue";
import clockAudioRecord from "@/components/templates/clockIn/clockAudioRecord.vue";
let curanswerTime = 0;
let countDownTime = 0;
let aswerControl;
let countDownControl;
let inputScrollTop = 0;
let serverIdImgArr = []; //上传图片的serverID
let imgData = {};
let player = null;
let ancyPlayer = null;
let playTimeControl = null;
let ancyplayTimeControl = null;
let moreTimeControl = null
let isCanPlay = false
let ancyisCanPlay = false
let clickFlag = true
let isTimeEndControl = null
export default {
  name: "ExaminationAnswer",
  components: {
    VueSlider,
    custDialog,
    Countdown,
    loadingStatusTem,
    watermark,
    clockAudioRecord
    //  ExaminationResult
  },
  props: [],
  data() {
    return {
      wHeight:
        window.innerHeight ||
        document.documentElement.clientHeight ||
        document.body.clientHeight,
      theme: localStorage.getItem("colorName") ? localStorage.getItem("colorName") : 'mb5_default',
      cfg: JSON.parse(localStorage.getItem("cfg")),
      examinationInfo: null,
      testRes: null,
      answerCardList: [],
      review: '',
      isPcWechat: false,
      hasCommit: false,
      isOver: 0,
      paperMainId: -1,
      paperDetailId: -1,
      questionId:'',
      topicId: '',
      examMainId: -1,
      isRelevance: '', //来自关联
      num: 1,
      showStart: false,
      isPause: false,
      answerTime: "00:00:00",
      questionInfo: null,
      optionsList: [],
      answerList: [false, false, false, false, false, false, false, false, false, false],
      timeProcess: 100,
      limitTime: 10,
      enableLimitTime: 0, //做题时是否限制时间 -1 不限制 1限制每道题 2限制总时间
      examModel: -1, //1考试模式 2练习模式
      everyTime: 0, //限制每道题的时间(单位秒)
      totalTime: 0, //做题限制的总时间（单位秒）
      wholeNum: 1, //总题数
      hasSmallNum: 1, //小题数
      isTimeUp: false,
      showAnalysis: false, //是否已经展示解析
      userAnswer: '',
      optionClass: [],
      examType: 0,
      essayAnswer: "", //问答题用户回答的内容
      fbAnswer: null, //填空题用户回答的内容
      uploadImgList: [], //需要上传的图片
      ttId: '', //营期ID
      tpId: '', //环节ID
      tlId: '', //课时ID
      entyCenter: '',
      smallNumber: 1,
      isWeiXin: true,
      moreQue: false,
      isFeedback: 0,
      clickShow: false,
      testPaperType: 1,
      clickFlag: true,
      showmoTest: true,
      leftNum: 0, //剩余题目数
      leftSmallNum: 0, //剩余小题数
      leftNumFlag: false, //交卷题目数展示
      showFirstSpeak: true,
      ancyshowFirstSpeak: true,
      showLoudspeaker: false,
      ancyshowLoudspeaker: false,
      processStyle: {
        "background-color": "#fff"
      },
      railStyle: {
        "background": "rgba(255,255,255,0.3)"
      },
      dotOptions: {
        style: {
          border: "1px solid #fff",
        },
      }, //进度条组件样式
      dragFlag: false, //进度拖拽
      ancydragFlag: false, //进度拖拽
      audioPlayTime: 0,
      ancyaudioPlayTime:0,
      playtime: '00:00:00',
      ancyplaytime: '00:00:00',
      playtotalTime: '00:00:00',
      ancyplaytotalTime: '00:00:00',
      duration: 0,
      ancyduration:0,
      playing: false,
      ancyPlaying:false,
      answerShow: false,
      answerName: '',
      errorFlag: false,
      showCar:false,
      unAnswerNum:'',
      fbAnswerStyle:[],
      showExamWatermark: false,
      playAduioSrc:'',
      showAudioRecordModal:false,
      uploadAudioList:[],
      examWatermarkConfig: JSON.parse(localStorage.getItem("examWatermarkConfig")) || '',
      errContent:'',
      showModal:false,
      selectIndex:0, // 获取其属性
      showSelectModal:false,
      timeOutNum:2,
      showTimeEnd:false,
      pauseText:'',
    };
  },
  created() {
    utilJs.appShare(this);
  },
  destroyed() {
    this.showCar = false
    if (player) {
      destoryPlayer(player);
      player = null;
      // document.querySelector("#liveVideoIntroParent").innerHTML = "";
    }
    if (ancyPlayer) {
      destoryPlayer(ancyPlayer);
      ancyPlayer = null;
    }
  },
  mounted() {
    setDocumentTitle("答题");// eslint-disable-line
    this.timeProcess = 100;
    countDownTime = 0;
    this.isTimeUp = false;
    this.hasCommit = false;
    curanswerTime = 0;
    this.pauseTimeControl();
    this.isPcWechat = utilJs.isWeiXin() && !utilJs.isMobileUserAgent();
    this.isWeiXin = utilJs.isWeiXin();
    this.paperMainId = this.$route.query.paperMainId;
    this.topicId = this.$route.query.topicId || '';
    this.num = Number(this.$route.query.goOnNum);
    this.smallNumber = 1;//this.$route.query.goOnNum;
    this.tpId = this.$route.query.tpId || ''; //环节id
    this.ttId = this.$route.query.ttId || '';
    this.tlId = this.$route.query.tlId || '';
    this.entyCenter = this.$route.query.entyCenter || '';
    this.ckFrom = this.$route.query.ckFrom || '';
    this.isRelevance = this.$route.query.isRelevance || '';
    //  this.showResult = this.$route.query.showResult==0 ? false:true;
    this.testPaperType = 1
    this.uploadAudioList = []
    this.playAduioSrc = ''
    this.showAudioRecordModal = false;
    this.testRes = null;
    this.answerCardList = [];
    this.showFirstSpeak = true
    this.ancyshowFirstSpeak = true
    this.showLoudspeaker = false
    this.ancyshowLoudspeaker = false
    this.answerList = [false, false, false, false, false, false, false, false, false, false];
    this.optionClass = ['noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose'];
    this.essayAnswer = "";
    this.showAnalysis = false;
    this.ancyaudioPlayTime = 0
    this.audioPlayTime = 0
    this.showExamWatermark = localStorage.getItem('enableExamWatermark') && localStorage.getItem('enableExamWatermark') == '1' ? true : false;
    let $this = this;
    utilJs.getMethod(global.apiurl + 'paper/enableWriteTester/' + this.paperMainId, function (res) {
      $this.answerName = res.realName
      $this.examMainId = res.examMainId
      if (res.enableWriteTester == 1 && res.alreadyWrite == 0) {
        if ($this.num == 1) {
          $this.showStart = false
          $this.answerShow = true
          // $this.getQuestion();
        } else {
          $this.showStart = false;
          $this.getQuestion();
        }
      } else {
        if ($this.num == 1) {
        //      this.getQuestion();
          $this.showStart = false
          $this.getQuestion();
        } else {
          $this.showStart = false;
          $this.getQuestion();
        }
      }
    })
    //获取阿里云签名，除了微信浏览器以外
    if (!utilJs.isWeiXin()) {
      utilJs.getAliSign(`${global.apiurl}imageSign`, res => {
        imgData = res;
      });
    }
    if (!$this.topicId) {
      utilJs.getMethod(
        global.apiurl + "paper/detail/" + $this.paperMainId,
        res => {
          if (res.isGrounding == 0) {
            $this.$routerGo($this, "replace", {
              path: "/error/emptyPage",
              query: {
                info: "很抱歉，该考试不存在"
              }
            });
          }
          if ((res.price * 1 > 0 && res.isGrounding == -1 && !res.permission) || (res.price * 1 == 0 && res.isGrounding == -1)) {
            $this.$routerGo($this, "replace", {
              path: "/error/emptyPage",
              query: {
                info: '很抱歉，该考试已下架'
              }
            })
          }
          $this.examinationInfo = res
          $this.wechatShare();
        }
      );
      return;
    }
    utilJs.getMethod(global.apiurl + 'exam/topicDetail/' + $this.topicId, function (res) {
      if ($this.isRelevance != 1 && res.permission == 0) {
        $this.$routerGo($this, "push", {
          path: "/homePage/examination/examinationDetail",
          query: { ExaminationNo: $this.topicId }
        });
      }
      $this.examinationInfo = res.topicInfo;
      $this.wechatShare();
    })
  },
  methods: {
    // 删除音频
    clickDelAudio(index) {
      if (document.getElementById("audioSelf")) {
        this.playAduioSrc = "";
        document.getElementById("audioSelf").src = this.playAduioSrc;
        document.getElementById("audioSelf").pause();
      }
      this.uploadAudioList.splice(index, 1);
    },
    //点击开始播放音频
    clickPlayAudio(audioUrl) {
      let audio = document.getElementById("audioSelf");
      if (this.playAduioSrc == audioUrl) {
        this.playAduioSrc = "";
        document.getElementById("audioSelf").src = this.playAduioSrc;
        return;
      }
      this.playAduioSrc = audioUrl;

      if (this.playAduioSrc && this.playAduioSrc.includes("http")) {
        document.getElementById("audioSelf").src = this.playAduioSrc;
        audio.play();
      }
    },

    //监听音频播放结束执行的内容
    playAudioSelfEnd() {
      this.playAduioSrc = "";
      document.getElementById("audioSelf").src = this.playAduioSrc;
    },
    clickAddAudio() {
      this.playAduioSrc = "";
      document.getElementById("audioSelf").src = this.playAduioSrc;
      if (utilJs.getAppVersion() > 0) {
        this.initAppRecordEvent();
        utilJs.sendDataToAppNew('record', 'appAudioStartRecord');
        return;
      }
      this.showAudioRecordModal = true;
    },
    //关闭录音弹窗
    closeAudioRecordModal(state) {
      if (state == 1) {
        this.showAudioRecordModal = false;
      }
    },
    //音频上传成功
    uploadAudioSuccess(audioContent, state) {
      if (state == 1) {
        this.showAudioRecordModal = false;
      }
      let audioItem = {
        url: audioContent.content,
        time: audioContent.time
      };
      this.uploadAudioList.push(audioItem);
      console.log(audioItem, 444444444444)
    },
    initAppRecordEvent() {
      window['cjAppAudioRecordResult'] = this.appRecordResult;
    },
    //app录音结果回调
    appRecordResult(resKey, time) {
      console.log('*******appRecordResult***', resKey, time)
      let resUrl = `https://qnoss.ckjr001.com/${resKey}`;
      let info = {
        content: resUrl,
        time:time
      }
      this.uploadAudioSuccess(info);
    },
    goQuestion(number) {
      // if (userAnswer) {
        let answerText = '';
        let $this = this;
        this.showAnalysis = false;
        answerText = this.transAnswerText();
        // let fbComplete = false;
        // if (this.questionInfo.status != -1 && this.questionInfo.problem && this.questionInfo.type == 5 || this.questionInfo.smallType == 5 || (this.questionInfo.type == 9 && this.questionInfo.realType == 5)) {
        //   $this.fbAnswer.forEach(item => {
        //     if (item.value.trim() == "") {
        //       fbComplete = true;
        //     }qnoss.ckjr001.com
        //   })
        // }

        // if (this.questionInfo.status != -1 && this.questionInfo.problem &&
        //   ((this.questionInfo.type != 9 && ((this.questionInfo.type != 5 && this.questionInfo.type != 3 && this.questionInfo.smallType != 5 && this.questionInfo.smallType != 3 && answerText.trim() == "") || ((this.questionInfo.type == 3 || this.questionInfo.smallType == 3) && answerText.trim() == "" && this.uploadImgList.length == 0) || ((this.questionInfo.type == 5 || this.questionInfo.smallType == 5) && fbComplete))) ||
        //     (this.questionInfo.type == 9 && ((this.questionInfo.realType != 5 && this.questionInfo.realType != 3 && answerText.trim() == "") || (this.questionInfo.realType == 3 && answerText.trim() == "" && this.uploadImgList.length == 0) || (this.questionInfo.realType == 5 && fbComplete)))) &&
        //   this.isTimeUp == false
        // ) {
        //   this.$showCjToast({
        //     text: (this.questionInfo.type == 3 || this.questionInfo.type == 5 || this.questionInfo.smallType == 3 || this.questionInfo.smallType == 5 || (this.questionInfo.type == 9 && (this.questionInfo.realType == 3 || this.questionInfo.realType == 5))) ? "请填写答案" : "请选择答案",
        //     type: "warn"
        //   });
        //   $this.clickFlag = true
        // } else {
          clearInterval(aswerControl);
          clearInterval(countDownControl);
          if ($this.enableLimitTime == 1) {
            $this.timeProcess = 100;
            countDownTime = 0;
          }
          this.isTimeUp = false;
          let answerCommit = {
            paperDetailId: $this.paperDetailId,
            options: answerText,
            examMainId: $this.examMainId,
            totalTime: curanswerTime,
            examOver: 0,
            topicId: $this.topicId
          };
          if ((this.questionInfo.type == 3 || this.questionInfo.smallType == 3 || (this.questionInfo.type == 9 && this.questionInfo.realType == 3)) && this.uploadImgList.length > 0) {
            answerCommit.imgArr = this.uploadImgList;
          }
          if ((this.questionInfo.type == 3 || this.questionInfo.smallType == 3 || (this.questionInfo.type == 9 && this.questionInfo.realType == 3)) && this.uploadAudioList.length > 0) {
            answerCommit.audioArr = this.uploadAudioList;
          }
          if (this.questionInfo.type == 4 || this.questionInfo.smallType == 4 || (this.questionInfo.type == 9 && this.questionInfo.realType == 4)) {
            if (answerCommit.options == '正确') {
              answerCommit.options = 1;
            } else if (answerCommit.options == '错误') {
              answerCommit.options = -1;
            }
          }
          if (this.questionInfo.type == 5 || this.questionInfo.smallType == 5 || (this.questionInfo.type == 9 && this.questionInfo.realType == 5)) {
            answerCommit.options = this.fbAnswer;
          }
          utilJs.postMethod(global.apiurl + 'paperLibrary/saveAnswer', answerCommit, function () {
            $this.showCar = false
            $this.clickFlag = true
            $this.num = number
            $this.smallNumber = 1;
            $this.getQuestion();
          },
            () => {
              $this.clickFlag = true
            }

          );
        // }
      // }
    },
    hideColumnList() {
      this.showCar = false
    },
    getAnswerSheet(type) {
      let answerUrl = global.apiurl + 'paper/testAnswerSheet/' + this.examMainId
      utilJs.getMethod(answerUrl, res => {
        this.answerCardList = res.answerSheet
        this.unAnswerNum = res.unAnswerNum
        if (type == 1) {
          this.showCar = true
        }
      })
    },
    cancelAnswer() {
      this.answerShow = false
      this.$router.go(-1);
    },
    onConfirmUpdate() {
      if (!clickFlag) {
        return
      }
      clickFlag = false
      if (this.answerName == null || this.answerName.trim() == '') {
        this.errorFlag = true
        clickFlag = true
      } else {
        this.errorFlag = false
        utilJs.postMethod(global.apiurl + "paper/submitTesterName", {
          paperMainId: this.paperMainId, // 试卷Id
          examMainId: this.examMainId, // 考试Id
          testerName: this.answerName// 做题人名字
        },
        () => {
          this.answerShow = false
          this.showStart = false
          clickFlag = true
          this.getQuestion();
        },
        () => {
          clickFlag = true
        }
      );
      }
    },
    //点击回答图片
    clickAnswerPic(event) {
      if (this.leftNumFlag && this.examModel == 2) {
        return
      }
      console.log(this.isWeiXin, event.target.files)
      if (this.uploadImgList.length >= 9) {
        this.$showCjToast({
          text: "图片最多只能传9张",
          type: "warn",
        });
        return;
      };
      if (this.isWeiXin) {
        wxUtilJs.chooseImage({
          count: 9, // 默认9
          sizeType: ["compressed"], // 可以指定是原图还是压缩图，默认二者都有
          sourceType: ["album", "camera"] // 可以指定来源是相册还是相机，默认二者都有
        }).then(localIds => {
          this.$loading.show({
            text: "上传中..."
          });
          serverIdImgArr = [];
          //获取剩余能传多少张图片，若已选的图片数量大于剩余数。则只传剩余数量的图片
          let residueLength = 9 - this.uploadImgList.length;
          if (localIds.length > residueLength) {
            localIds.length = residueLength;
          }
          this.wxUploadImg(localIds, localIds.length - 1);
        });
      } else {
        utilJs.imgUpload(event.target.files, imgData, 'exam', res => {
          let urlObj = {
            url: res
          };
          this.uploadImgList.push(urlObj)
        }, () => {});
      }
    },

    //上传图片到微信-----IOS不能一次性传多张，只好递归传
    wxUploadImg(localIds, localIdsLength) {
      wxUtilJs
        .uploadImage({
          localId: localIds[localIdsLength]
        }, true)
        .then(res => {
          serverIdImgArr.push(res);
          if (localIdsLength > 0) {
            this.wxUploadImg(localIds, --localIdsLength);
          } else {
            this.syncUploadPic(serverIdImgArr);
          }
        });
    },

    //上传图片到服务器
    syncUploadPic(serverIdArr) {
      utilJs.postMethod(global.apiurl + "signCard/downWxImg ", {
        serverId: JSON.stringify(serverIdArr),
        mediaType: 2
      },
        res => {
          this.$loading.hide();
          for (let key of res) {
            if (this.uploadImgList.length >= 9) {
              break;
            }
            let urlObj = {
              url: key
            };
            this.uploadImgList.push(urlObj)
          }
        },
        () => {
          this.$loading.hide();
        }
      );
    },
    //删除上传的图片
    delUploadImage(index) {
      if (this.leftNumFlag && this.examModel == 2) {
        return
      }
      this.uploadImgList.splice(index, 1);
    },

    //点击图片放大预览
    clickPreviewImage(imgUrl) {
      if (!imgUrl) {
        return;
      }
      let imgArr = [];
      for (let key of this.uploadImgList) {
        imgArr.push(key.url);
      }
      wxUtilJs.previewImage({
        current: imgUrl, // 当前显示图片的http链接
        urls: imgArr // 需要预览的图片http链接列表
      });
    },
    //IOS微信6.7以上版本会导致输入法收起的时候，键盘没收起，需要手动滚下屏幕
    inputFocus() {
      if (navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        inputScrollTop = document.documentElement.scrollTop || document.body.scrollTop;
      }
    },
    inputBlur() {
      if (navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
        setTimeout(() => {
          document.body.scrollTop = inputScrollTop - 1 || 0;
        });
      }
    },
    setAnalysisStyle(userAnswer, rightAnswer) {
      var userAnswerT = userAnswer == '正确' ? 'A' : (userAnswer == '错误' ? 'B' : userAnswer);
      var rightAnswerT = rightAnswer == '1' ? 'A' : (rightAnswer == '-1' ? 'B' : rightAnswer);
      if (this.questionInfo.type == 1 || this.questionInfo.type == 2 || this.questionInfo.type == 4 || this.questionInfo.smallType == 1 || this.questionInfo.smallType == 2 || this.questionInfo.smallType == 4 || (this.questionInfo.type == 9 && (this.questionInfo.realType == 1 || this.questionInfo.realType == 2 || this.questionInfo.realType == 4))) {
        let lettersT = 'ABCDEFGHIJ';
        let userArr = [];
        let rightArr = [];
        let aIndex = -1;
        let rIndex = -1;

        userArr = userAnswerT.split('');
        rightArr = rightAnswerT.split('');

        for (let i = 0; i < userArr.length; i++) {
          aIndex = lettersT.indexOf(userArr[i]);
          this.$set(this.optionClass, aIndex, 'analysisUser');
          // if (rightAnswerT.indexOf(userArr[i]) == -1) {
          //   this.optionsList[aIndex].type = "X"
          // }
        }
        for (let i = 0; i < rightArr.length; i++) {
          rIndex = lettersT.indexOf(rightArr[i]);
          this.$set(this.optionClass, rIndex, 'analysisRight');
        }
      } else if (this.questionInfo.type == 5 || this.questionInfo.smallType == 5 || (this.questionInfo.type == 9 && this.questionInfo.realType == 5)) {
        let fbRightAnswer = JSON.parse(JSON.stringify(this.questionInfo.answer));
        let hasRightAnswer = false;
        for (let i = 0; i < this.fbAnswer.length; i++) {
          if (this.questionInfo.enableDisorderMatch == 1) {//是否是乱序模式
              for (let j = 0; j < fbRightAnswer.length; j++) {
                let answerTextArr = []
                if (fbRightAnswer[j].value.indexOf(";") > -1) {
                  answerTextArr = fbRightAnswer[j].value.split(";")
                } else {
                  answerTextArr.push(fbRightAnswer[j].value)
                }
                for (let k = 0; k < answerTextArr.length; k++) {
                  if (this.fbAnswer[i].value.trim() == answerTextArr[k].trim()) {
                    hasRightAnswer = true;
                    fbRightAnswer.splice(j, 1);
                    break;
                  }
                }
              }
            } else {
              let answerTextArr = []
              if (fbRightAnswer[i].value.indexOf(";") > -1) {
                answerTextArr = fbRightAnswer[i].value.split(";")
              } else {
                answerTextArr.push(fbRightAnswer[i].value)
              }
              for (let k = 0; k < answerTextArr.length; k++) {
                if (this.fbAnswer[i].value.trim() == answerTextArr[k].trim()) {
                  hasRightAnswer = true;
                  break;
                }
              }
            }
          if (hasRightAnswer) {
            this.$set(this.fbAnswerStyle, i, 'right');
          } else {
            this.$set(this.fbAnswerStyle, i, 'wrong');
          }
          hasRightAnswer = false;
        }
      }
      //  else if (this.questionInfo.type == 3 || this.questionInfo.smallType == 3) {
      // }
    },
    clickOption(index) {
      if (this.questionInfo.smallType == 11 || this.questionInfo.type == 11 || this.questionInfo.type == 1 || this.questionInfo.type == 4 || this.questionInfo.smallType == 1 || this.questionInfo.smallType == 4 || ((this.questionInfo.type == 9) && (this.questionInfo.realType == 1 || this.questionInfo.realType == 4))) {
        if (this.showAnalysis == false) {
          this.answerList = [false, false, false, false, false, false, false, false, false, false];
          this.optionClass = ['noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose'];
          this.$set(this.answerList, index, true);
          this.$set(this.optionClass, index, 'choose');
          console.log(this.optionClass, 'optionClass')
          if (this.questionInfo.smallType == 11 || this.questionInfo.type == 11) {
            let lettersT = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J'];
            let btn = document.getElementsByClassName('selectClass')
            btn[this.selectIndex].innerHTML = lettersT[index]
            this.showSelectModal = false
            this.userAnswer = this.transAnswerText();
          }
          if (this.examModel == 2) { //练习模式
            this.userAnswer = this.transAnswerText();
            if (this.questionInfo.smallType == 11 || this.questionInfo.type == 11) {
              this.setAnalysisStyle(this.userAnswer, this.questionInfo.answer);
              // this.showAnalysis = true;
            } else {
              this.setAnalysisStyle(this.userAnswer, this.questionInfo.answer);
              this.showAnalysis = true;
               clearInterval(countDownControl);
            }
          }
        }
      } else if (this.questionInfo.type == 2 || this.questionInfo.smallType == 2 || (this.questionInfo.type == 9 && this.questionInfo.realType == 2)) {
        if (this.showAnalysis == false) {
          this.$set(this.answerList, index, !this.answerList[index]);
          if (this.optionClass[index] == 'choose') {
            this.$set(this.optionClass, index, 'noChoose');
          } else if (this.optionClass[index] == 'noChoose') {
            this.$set(this.optionClass, index, 'choose');
          }
          this.clickShow = true
        }
        //      this.answerList[index] = !this.answerList[index];
      }
    },
    hideCountdown() {
      if (this.showStart == true) {
        this.showStart = false;
        this.getQuestion();
      }
    },
    aswerTimeControl() {
      //答题时间计时器
      let that = this;
      clearInterval(aswerControl)
      aswerControl = null
      aswerControl = setInterval(function () {
        curanswerTime++;
        that.answerTime = that.timeToStr(curanswerTime);
      }, 1000);
    },
    aswerTimeCountDown() {
      //答题时间倒计时
      let that = this;
      clearInterval(countDownControl)
      countDownControl = null
      countDownControl = setInterval(function () {
        countDownTime = countDownTime + 10;
        that.timeProcess = 100 - countDownTime * 100 / (that.limitTime * 1000)
        if (that.timeProcess <= 0) {
          if (that.examModel == 1 || that.examModel == 3) {
            if (that.isOver == 0 && that.enableLimitTime == 1) { //单题答题时间到，不是最后一题
              that.isTimeUp = true;
              that.clickNextQuestion(1)
            } else if (that.isOver == 1 && that.enableLimitTime == 1) { //单题答题时间到，并且是最后一题
              that.isTimeUp = true;
              that.clickNextQuestion(2)
            } else if (that.enableLimitTime == 2) { //总的答题时间到
              that.isTimeUp = true;
              that.clickNextQuestion(3, 0)
            }
          } else if (that.examModel == 2) { //练习模式
            that.isTimeUp = true;
            that.userAnswer = that.transAnswerText();
              that.setAnalysisStyle(that.userAnswer, that.questionInfo.answer);
            that.showAnalysis = true
          }
        }
      }, 10);
    },
    pauseTimeControl() {
      if (player) {
        player.pause();
      }
      if (ancyPlayer) {
        ancyPlayer.pause();
      }
      if (document.getElementById("audio").src != '') {
        document.getElementById('audio').pause();
        this.showFirstSpeak = true
      }
      if (document.getElementById("ancyaudio").src != '') {
        this.ancyshowFirstSpeak = true
        document.getElementById('ancyaudio').pause();
      }
      //暂停，清楚计时器
      clearInterval(aswerControl);
      clearInterval(countDownControl);
    },
    timeToStr(timeSecond) {
      //将秒转化为00:00:00格式
      let hour =
        Math.floor(timeSecond / 3600) >= 10
          ? Math.floor(timeSecond / 3600)
          : "0" + Math.floor(timeSecond / 3600);
      let minute =
        Math.floor((timeSecond % 3600) / 60) >= 10
          ? Math.floor((timeSecond % 3600) / 60)
          : "0" + Math.floor((timeSecond % 3600) / 60);
      let second =
        Math.floor(timeSecond % 60) >= 10
          ? Math.floor(timeSecond % 60)
          : "0" + Math.floor(timeSecond % 60);
      return hour + ":" + minute + ":" + second;
    },
    clickPause() {
      //点击暂停
      this.isPause = true;
      let answerText = '';
      answerText = this.transAnswerText();
      let fbComplete = false;
      if (Array.isArray(answerText) && answerText.length > 0) {
        for (let i = 0;i < answerText.length;i++) {
          if (answerText[i].value.trim() == "") {
            fbComplete = true;
            break;
          } else {
            fbComplete = false;
          }
        }
      }
      this.pauseText = '共' + this.questionInfo.wholeNum + '道题目，还有剩下' +
      (this.unAnswerNum == 0 ? '0' :
      (this.leftNumFlag ? Number(this.unAnswerNum) :
      (answerText == '' || fbComplete ? Number(this.unAnswerNum) :
      (Number(this.unAnswerNum) - 1 != 0 ? (Number(this.unAnswerNum) - 1) : '0')))) + '道未做'
      this.pauseTimeControl();
    },
    transAnswerText() {
      var answerText = '';
      let lettersT = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J'];
      if (this.questionInfo.type == 1 || this.questionInfo.type == 2 || this.questionInfo.smallType == 1 || this.questionInfo.smallType == 2 || (this.questionInfo.type == 9 && (this.questionInfo.realType == 1 || this.questionInfo.realType == 2))) {
        for (let i = 0; i < this.optionsList.length; i++) {
          if (this.answerList[i] == true) {
            answerText = answerText + lettersT[i];
          }
        }
      } else if (this.questionInfo.type == 4 || this.questionInfo.smallType == 4 || (this.questionInfo.type == 9 && this.questionInfo.realType == 4)) {
        if (this.answerList[0] == true) {
          answerText = "正确";
        } else if (this.answerList[1] == true) {
          answerText = "错误";
        }
      } else if (this.questionInfo.type == 3 || this.questionInfo.smallType == 3 || (this.questionInfo.type == 9 && this.questionInfo.realType == 3)) {
        answerText = this.essayAnswer;
      } else if (this.questionInfo.type == 5 || this.questionInfo.smallType == 5 || (this.questionInfo.type == 9 && this.questionInfo.realType == 5)) {
        answerText = this.fbAnswer;
      } else if (this.questionInfo.type == 11) {
        if (this.examModel == 2 && this.leftNumFlag == true) {
          answerText = this.questionInfo.userAnswer
        } else {
          var myselect = document.getElementsByClassName("selectClass")
          var index = []
          for (let i = 0;i < myselect.length;i++) {
            let option = {value: myselect[i].innerHTML == (i * 1 + 1) + '. 点击答题' ? '' : myselect[i].innerHTML, key: i, }
            index.push( option);
          }
          answerText = index
        }
      }
      return answerText
    },
    //上一题保存数据
    preSaveQuestion() {
      let answerText = '';
      let $this = this;
      answerText = this.transAnswerText();
        clearInterval(aswerControl);
        clearInterval(countDownControl);
        if ($this.enableLimitTime == 1) {
          $this.timeProcess = 100;
          countDownTime = 0;
        }
        this.isTimeUp = false;
        let answerCommit = {
          paperDetailId: $this.paperDetailId,
          options: answerText,
          examMainId: $this.examMainId,
          totalTime: curanswerTime,
          examOver: 0,
          topicId: $this.topicId
        };
        if ((this.questionInfo.type == 3 || this.questionInfo.smallType == 3 || (this.questionInfo.type == 9 && this.questionInfo.realType == 3)) && this.uploadImgList.length > 0) {
          answerCommit.imgArr = this.uploadImgList;
        }
        if ((this.questionInfo.type == 3 || this.questionInfo.smallType == 3 || (this.questionInfo.type == 9 && this.questionInfo.realType == 3)) && this.uploadAudioList.length > 0) {
          answerCommit.audioArr = this.uploadAudioList;
        }
        if (this.questionInfo.type == 4 || this.questionInfo.smallType == 4 || (this.questionInfo.type == 9 && this.questionInfo.realType == 4)) {
          if (answerCommit.options == '正确') {
            answerCommit.options = 1;
          } else if (answerCommit.options == '错误') {
            answerCommit.options = -1;
          }
        }
        if (this.questionInfo.type == 5 || this.questionInfo.smallType == 5 || (this.questionInfo.type == 9 && this.questionInfo.realType == 5)) {
          answerCommit.options = this.fbAnswer;
        }
        utilJs.postMethod(global.apiurl + 'paperLibrary/saveAnswer', answerCommit, function () {
          $this.clickFlag = true
          if ($this.questionInfo.type == 9) {
            $this.isOver = 0;
            if (parseInt($this.smallNumber) == 1) {
          // $this.smallNumber = 1;
              $this.num = $this.num == 1 ? $this.num : parseInt($this.num) - 1;
            }
            $this.smallNumber = $this.smallNumber == 1 ? 1 : parseInt($this.smallNumber) - 1;
          } else {
            $this.isOver = 0;
            $this.num = $this.num == 1 ? $this.num : parseInt($this.num) - 1;
            $this.smallNumber = 1;
          }
          $this.getQuestion();
        },
          () => {
            $this.clickFlag = true
          }

        );
      // }
    },
    clickPreQuestion() {
      //进入上一题
      let $this = this;
      if ($this.testPaperType == 2) {
        this.$showCjToast({
          text: "随机题目不可返回上一题",
          type: "warn"
        });
        return
      }
      if (($this.questionInfo.type != 9 && $this.num == 1) || ($this.questionInfo.type == 9 && $this.num == 1 && $this.smallNumber == 1)) {
        return
      }
      if (!$this.clickFlag) {
        return
      }
      this.showAnalysis = false;
      $this.clickFlag = false
      $this.preSaveQuestion();
    },
    clickNextQuestion(type, selfClick) {
      let answerText = '';
      let $this = this;
      answerText = this.transAnswerText();
      let fbComplete = false;
      if (Array.isArray(answerText) && answerText.length > 0) {
        for (let i = 0;i < answerText.length;i++) {
          if (answerText[i].value.trim() == "") {
            fbComplete = true;
            break;
          } else {
            fbComplete = false;
          }
        }
      }
        this.isTimeUp = false;
        let answerCommit = {
          paperDetailId: $this.paperDetailId,
          options: answerText,
          examMainId: $this.examMainId,
          totalTime: curanswerTime,
          examOver: $this.isOver,
          topicId: $this.topicId
        };
        if ((this.questionInfo.type == 3 || this.questionInfo.smallType == 3 || (this.questionInfo.type == 9 && this.questionInfo.realType == 3)) && this.uploadImgList.length > 0) {
          answerCommit.imgArr = this.uploadImgList;
        }
        if ((this.questionInfo.type == 3 || this.questionInfo.smallType == 3 || (this.questionInfo.type == 9 && this.questionInfo.realType == 3)) && this.uploadAudioList.length > 0) {
          answerCommit.audioArr = this.uploadAudioList;
        }
        if (this.questionInfo.type == 4 || this.questionInfo.smallType == 4 || (this.questionInfo.type == 9 && this.questionInfo.realType == 4)) {
          if (answerCommit.options == '正确') {
            answerCommit.options = 1;
          } else if (answerCommit.options == '错误') {
            answerCommit.options = -1;
          }
        }
        if (this.questionInfo.type == 5 || this.questionInfo.smallType == 5 || (this.questionInfo.type == 9 && this.questionInfo.realType == 5)) {
          answerCommit.options = this.fbAnswer;
        }
        if (type != 1 && selfClick == 1) {
          this.hasCommit = true
          this.$cjConfirm({
            title: '交卷提示', //
            titleCenter: true, //标题是否居中
            message: this.unAnswerNum == 0 ? '答题完毕，确认交卷！' : (this.leftNumFlag ? '您还有' + Number(this.unAnswerNum) + '道题未作答，是否继续交卷' :
            (answerText == '' || fbComplete ? '您还有' + Number(this.unAnswerNum) + '道题未作答，是否继续交卷' :
            (Number(this.unAnswerNum) - 1 != 0 ? '您还有' + (Number(this.unAnswerNum) - 1) + '道题未作答，是否继续交卷' :
            '答题完毕，确认交卷！'))), //弹窗内容
            messageCenter: true, //内容是否居中
            showMasker: true, //是否显示透明背景
            clickCloseModal: false, //是否点击透明背景关闭弹窗
            showCancelButton: true, //是否显示取消按钮
            cancelButtonText: '', //取消按钮文本
            confirmButtonText: '', //确认按钮文本
            onConfirm() {
              clearInterval(aswerControl);
              clearInterval(countDownControl);
              clearInterval(playTimeControl);
              clearInterval(ancyplayTimeControl);
              clearInterval(moreTimeControl);
              $this.hasCommit = false
              $this.continueQue(type, answerCommit, selfClick)
            }, //确认事件回调
            onCancel() {
              if ($this.enableLimitTime != -1) {
                $this.aswerTimeCountDown();
              }
              $this.hasCommit = false; return false
            }, //取消事件回调
          })
        } else {
          if (this.hasCommit) {
            this.pauseTimeControl()
          } else {
            this.hasCommit = false
            this.continueQue(type, answerCommit, selfClick)
            clearInterval(playTimeControl);
            clearInterval(ancyplayTimeControl);
            clearInterval(moreTimeControl);
            clearInterval(aswerControl);
            clearInterval(countDownControl);
          }
        }
      // }
      //    else{
      //      $this.$routerGo($this, "push", {
      //        path: "/homePage/examination/examinationResult",
      //        query: { paperMainId: $this.paperMainId,topicId: $this.topicId }
      //      });
      //    }
    },
    continueQue(type, answerCommit, selfClick) {
      let $this = this
      if (type == 3) {
        answerCommit.examOver = 1;
        if (selfClick == 0) {
          answerCommit.isForce = 1
        } else {
          answerCommit.isForce = 0
        }
      }
      if ((type == 2 || type == 3) && $this.ttId) {
        localStorage.setItem(`camp${this.tlId}`, 100);
        // this.setProgress();
      }
      if (this.hasCommit == false) {
        this.hasCommit = true;
        utilJs.postMethod(global.apiurl + 'paperLibrary/saveAnswer', answerCommit, function (res) {
          if (res.isEnd == 1) {
          $this.$loading.hide();
          $this.$showCjToast({
            text: res.message,
            type: 'warn',
          });
          $this.hasCommit = false;
          if ($this.topicId) {
            $this.$routerGo($this, "replace", {
              path: "/homePage/examination/examinationDetail",
              query: { ExaminationNo: $this.topicId }
            });
          } else {
            $this.$routerGo($this, "replace", {
              path: "/homePage/testPaper/testDetail",
              query: { testId: $this.paperMainId }
            });
          }
          return
        }
          if ($this.examModel == 2) {
            $this.showAnalysis = false;
          }
          if (type == 1) { //进入下一题
            if ($this.enableLimitTime == 1) {
              $this.timeProcess = 100;
              countDownTime = 0;
            }
            if ($this.questionInfo.type == 9) {
              $this.isOver = (($this.num == $this.wholeNum) && ($this.hasSmallNum == $this.smallNumber)) ? 1 : 0;
              if (parseInt($this.smallNumber) == parseInt($this.hasSmallNum)) {
                  // $this.smallNumber = 1;
                $this.num = parseInt($this.num) + 1
                  // $this.num = $this.num < $this.wholeNum ? parseInt($this.num) + 1 : $this.num;
              }
              $this.smallNumber = $this.smallNumber < $this.hasSmallNum ? parseInt($this.smallNumber) + 1 : 1;
            } else {
              $this.isOver = $this.num < $this.wholeNum ? 0 : 1;
              $this.num = parseInt($this.num) + 1
                // $this.num = $this.num < $this.wholeNum ? parseInt($this.num) + 1 : $this.num;
              $this.smallNumber = 1;
            }
            $this.getQuestion();
          } else { //最后一题或者提前交卷
            $this.timeProcess = 100;
            countDownTime = 0;
            clearInterval(playTimeControl);
            clearInterval(ancyplayTimeControl);
            clearInterval(moreTimeControl);
            if (!isTimeEndControl) {
              $this.$routerGo($this, "replace", {
                path: "/homePage/examination/examinationResult",
                query: {
                  paperMainId: $this.paperMainId,
                  topicId: $this.topicId,
                  isRelevance: $this.isRelevance,
                  entyCenter: $this.entyCenter,
                  ttId: $this.ttId,
                  tpId: $this.tpId,
                  tlId: $this.tlId,
                  progress: $this.progress,
                  duration: curanswerTime
                }
              });
            }
          }
        }, () => {
          $this.hasCommit = false;
        });
      }
    },
    // 记录播放进度
    setProgress: function () {
      let data = {
        ttId: this.ttId, //营期ID
        tpId: this.tpId, //环节ID
        tlId: this.tlId, //课时ID
        ratio: 100, //完成进度0-100
        duration: curanswerTime
      }
      utilJs.postMethod(global.apiurl + 'k12/trainings/progress', data, function () { });
    },
    initQPlayer() {
      let videoObj = {
        videoMp4: this.questionInfo.resourceUrl,
        videoM3U8: this.questionInfo.resourceUrl,
        autoplay: false,
        fluid: false,
        isCssFullScreen: true,
        poster: require("../../../../public/i/wap/index/poster.png")
      };
      player = getXgplayer("liveVideoIntroParent", videoObj);
      if (player.playerType == "xg") {
        player.on('ready', () => {
          document.querySelector(".xgplayer-start").style.zIndex = 99;
        })
      }
      player.on("play", () => {
        if (ancyPlayer) {
          ancyPlayer.pause();
        }
        if (document.getElementById("ancyaudio").src != '') {
          this.ancyshowFirstSpeak = true
          document.getElementById('ancyaudio').pause();
        }
      });
      if (document.querySelector(".xgplayer-start")) {
        document.querySelector(".xgplayer-start").style.zIndex = '99';
      }
    },
    initQPlayerAncy() {
      let videoObj = {
        videoMp4: this.questionInfo.analysisRurl,
        videoM3U8: this.questionInfo.analysisRurl,
        autoplay: false,
        fluid: false,
        isCssFullScreen: true,
        poster: require("../../../../public/i/wap/index/poster.png")
      };
      ancyPlayer = getXgplayer("ancyVideoIntroParent", videoObj);
      if (ancyPlayer.playerType == "xg") {
        ancyPlayer.on('ready', () => {
          document.querySelector(".xgplayer-start").style.zIndex = 99;
        })
      }
      if (document.querySelector(".xgplayer-start")) {
        document.querySelector(".xgplayer-start").style.zIndex = '99';
      }
      ancyPlayer.on("play", () => {
        if (player) {
          player.pause();
        }
        if (document.getElementById("audio").src != '') {
          document.getElementById('audio').pause();
          this.showFirstSpeak = true
        }
      });
    },
    Videoplay() {
      if (this.questionInfo.resourceUrl) {
        player.play()
        this.playing = true
      }
    },
    VideoplayAncy() {
      if (this.questionInfo.analysisRurl) {
        ancyPlayer.play()
        this.ancyPlaying = true
      }
    },
    clickDesc(e) {
      if (e.target.tagName == 'IMG' && e.target.src) {
        wxUtilJs.previewImage({
          current: e.target.src, // 当前显示图片的http链接
          urls: [e.target.src] // 需要预览的图片http链接列表
        });
      }
    },
    getQuestion() {
      this.answerList = [false, false, false, false, false, false, false, false, false, false];
      this.optionClass = ['noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose'];
      this.optionsList = [];
      this.questionInfo = null;
      this.fbAnswer = null;
      this.uploadImgList = [];
      this.essayAnswer = "";
      this.moreQue = false
      this.clickShow = false
      let $this = this;
      this.errContent = ''
      this.showFirstSpeak = true;
      this.ancyshowFirstSpeak = true
      this.showLoudspeaker = false;
      this.ancyshowLoudspeaker = false;
      this.audioPlayTime = 0;
      this.ancyaudioPlayTime = 0;
      this.playtime = '00:00:00';
      this.playtotalTime = '00:00:00';
      this.ancyplaytime = '00:00:00';
      this.ancyplaytotalTime = '00:00:00';
      this.duration = 0;
      this.ancyduration = 0;
      this.playing = false
      this.ancyPlaying = false
      this.fbAnswerStyle = []
      this.uploadAudioList = []
      this.showSelectModal = false
      this.selectIndex = 0
      this.userAnswer = ""
      clearInterval(playTimeControl);
      clearInterval(ancyplayTimeControl);
      clearInterval(moreTimeControl);
      clearInterval(isTimeEndControl)
      clearInterval(aswerControl)
      this.$loading.show({
        text: ""
      });
      if (!document.getElementById('audio').ended) {
        document.getElementById("audio").pause();
      }
      if (!document.getElementById('ancyaudio').ended) {
        document.getElementById("ancyaudio").pause();
      }
      if (this.num != 1) { //防止答题过程中手动刷新页面，又要从第一题开始做答
        this.$routerGo(this, "replace", {
          path: "/homePage/examination/examinationAnswer",
          query: {
            paperMainId: this.paperMainId,
            topicId: this.topicId,
            goOnNum: this.num,
            entyCenter: this.entyCenter,
          }
        });
      }
      let questionUrl = '';
      // if (this.questionInfo && this.questionInfo.type == 7) {
      questionUrl = global.apiurl + 'paperLibrary/getQuestion/' + this.paperMainId + '?topicId=' + this.topicId + '&number=' + this.num + '&smallNumber=' + this.smallNumber;
      // } else {
      //   questionUrl = global.apiurl + 'exam/examProcess/' + this.paperMainId + '?topicId=' + this.topicId + '&number=' + this.num;
      // }
      utilJs.getMethod(questionUrl, function (res) {
        if (JSON.stringify(res) === '[]') {
          $this.$routerGo($this, "replace", {
            path: JSON.stringify(res) === '[]' ? `/error/emptyPage?from=exam&info=考试题目数量不足，请联系管理人员！` : `/error/emptyPage?from=exam&info=考试题目为空，请联系管理人员！`
          });
        }
        if (typeof (res) == 'string') {
          $this.$loading.hide();
          $this.$showCjToast({
            text: res,
            type: 'warn',
          });
          if ($this.topicId) {
            $this.$routerGo($this, "replace", {
              path: "/homePage/examination/examinationDetail",
              query: { ExaminationNo: $this.topicId }
            });
          } else {
            $this.$routerGo($this, "replace", {
              path: "/homePage/testPaper/testDetail",
              query: { testId: $this.paperMainId }
            });
          }
          // $this.$router.go(-1);
          return
        }
        $this.$loading.hide();
        $this.hasCommit = false;
        $this.questionInfo = res;
        $this.paperDetailId = res.paperDetailId;
        $this.questionId = res.questionId
        $this.examMainId = res.examMainId;
        $this.examType = res.paperType;
        curanswerTime = res.continueTime;
        $this.enableLimitTime = res.paperInfo.enableLimitTime;
        $this.examModel = res.paperInfo.examModel;
        $this.wholeNum = res.wholeNum
        $this.smallNumber = res.smallNumber
        $this.hasSmallNum = res.hasSmallNum
        $this.isFeedback = res.isFeedback
        $this.testPaperType = res.paperInfo.testPaperType
        $this.leftNum = res.leftNum
        $this.leftSmallNum = res.leftSmallNum
        $this.uploadAudioList = res.audioArr
        $this.userAnswer = res.userAnswer
        clearInterval(aswerControl)
        $this.aswerTimeControl();
        if ($this.enableLimitTime == 1) {
          $this.limitTime = res.paperInfo.everyTime;
          $this.aswerTimeCountDown();
        } else if ($this.enableLimitTime == 2) {
          $this.limitTime = res.paperInfo.totalTime * 60;
          countDownTime = res.continueTime * 1000;
          $this.aswerTimeCountDown();
        } else if ($this.enableLimitTime == -1) {
          clearInterval(countDownControl);
        }
        if (player) {
          destoryPlayer(player);
          player = null;
          // document.querySelector("#liveVideoIntroParent").innerHTML = "";
        }
        if (ancyPlayer) {
          destoryPlayer(ancyPlayer);
          ancyPlayer = null;
          // document.querySelector("#liveVideoIntroParent").innerHTML = "";
        }
        if ($this.questionInfo.status == 1 && $this.questionInfo.resourceUrl && $this.questionInfo.resourceUrl != '' && $this.questionInfo.resourceType == 1) {
          $this.$nextTick(function () {
            $this.initQPlayer();
          })
        }
        if ($this.questionInfo.status == 1 && $this.questionInfo.analysisRurl && $this.questionInfo.analysisRurl != '' && $this.questionInfo.analysisRtype == 1) {
          $this.$nextTick(function () {
            $this.initQPlayerAncy();
          })
        }
        let audio = document.getElementById("audio");
        audio.src = '';
        if ($this.questionInfo.resourceUrl != '' && $this.questionInfo.resourceType == 2) {
          // $this.$nextTick(function () {
          audio.src = $this.questionInfo.resourceUrl;
          document.getElementById('audio').removeEventListener('timeupdate', $this.audioTimeUpdate);
          document.getElementById('audio').removeEventListener('canplay', $this.audioCanPlay);
          document.getElementById('audio').addEventListener('timeupdate', $this.audioTimeUpdate);
          document.getElementById('audio').addEventListener('canplay', $this.audioCanPlay);
          // })
        }
        let ancyaudio = document.getElementById("ancyaudio");
        ancyaudio.src = '';
        if ($this.questionInfo.analysisRurl != '' && $this.questionInfo.analysisRtype == 2) {
          // $this.$nextTick(function () {
          ancyaudio.src = $this.questionInfo.analysisRurl;
          document.getElementById('ancyaudio').removeEventListener('timeupdate', $this.ancyAudioTimeUpdate);
          document.getElementById('ancyaudio').removeEventListener('canplay', $this.ancyAudioCanPlay);
          document.getElementById('ancyaudio').addEventListener('timeupdate', $this.ancyAudioTimeUpdate);
          document.getElementById('ancyaudio').addEventListener('canplay', $this.ancyAudioCanPlay);
          // })
        }
        if ($this.questionInfo.type == 4 || $this.questionInfo.smallType == 4 || ($this.questionInfo.type == 9 && $this.questionInfo.realType == 4)) {
          $this.questionInfo.optionA = "正确";
          $this.questionInfo.optionB = "错误";
        }
        if ($this.questionInfo.type == 1 || $this.questionInfo.type == 2 || $this.questionInfo.type == 11 || $this.questionInfo.type == 4 || $this.questionInfo.smallType == 1 || $this.questionInfo.smallType == 2 || $this.questionInfo.smallType == 4 || ($this.questionInfo.type == 9 && ($this.questionInfo.realType == 1 || $this.questionInfo.realType == 2 || $this.questionInfo.realType == 4))) {
          const optionArr = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J'];
          for (let i = 0; i < 10; i++) {
            let optionSty = `option${optionArr[i]}`;
            if ($this.questionInfo[optionSty] != '' && $this.questionInfo[optionSty] != null) {
              $this.optionsList.push({ type: optionArr[i], name: $this.questionInfo[optionSty] });
            }
          }
        }
        if ($this.questionInfo.userAnswer == '' || $this.questionInfo.userAnswer == null || ($this.questionInfo.userAnswer.length == 1 && $this.questionInfo.userAnswer[0].value == '')) {
          // if (($this.questionInfo.type == 3 || $this.questionInfo.smallType == 3) && $this.questionInfo.imgArr.length > 0) {
          //   $this.leftNumFlag = true
          // } else {
            $this.leftNumFlag = false
          // }
        } else {
          if (Array.isArray($this.questionInfo.userAnswer) && $this.questionInfo.userAnswer.length > 0) {
            for (let i = 0;i < $this.questionInfo.userAnswer.length;i++) {
              if ($this.questionInfo.userAnswer[i].value.trim() == "") {
                $this.leftNumFlag = false
                break;
              } else {
                $this.leftNumFlag = true
              }
            }
          } else if ($this.questionInfo.userAnswer != "") {
            $this.leftNumFlag = true
          }
        }
        if ($this.questionInfo.type == 11 && $this.examModel != 2) {
          let str = $this.questionInfo.problem;
          // match 方法返回匹配的数组
          let res = str.match(/\{\{[\d}]*?\}\}/g);
          let count = !res ? 0 : res.length;
          if ($this.questionInfo.userAnswer == null || ($this.questionInfo.userAnswer.length == 1 && $this.questionInfo.userAnswer[0].value == '')) {
            $this.questionInfo.userAnswer = []
            for (let k = 0; k < count; k++) {
              $this.questionInfo.userAnswer[k] = {value : "", key : ""}
            }
          }
          console.log('22222', $this.questionInfo.userAnswer == null || ($this.questionInfo.userAnswer.length == 1 && $this.questionInfo.userAnswer[0].value == ''), $this.questionInfo.userAnswer)
          for (let i = 0; i < count; i++) {
            $this.questionInfo.problem = $this.questionInfo.problem.replace(/\{\{[\d}]*?\}\}/, function() {
              // let match = "<span class='c-ww60 c-inlineblack selectClass' onclick='alert(111)'></span>"
              const newOption = $this.questionInfo.newOption[i]
              let addSpane = true
              let match = '<span name=' + count + ' class="c-inlineblack c-lh36 c-mh10 c-minw140 c-bd0 c-br0 c-fc-xblue c-textAlign-c c-ph10 c-p c-bg-white" style="text-align-last: center;font-size: 0.6rem;border-bottom:1px solid">'
                for (let j = 0; j < newOption.options.length; j++) {
                  if (newOption != '' && newOption != null) {
                    if ($this.questionInfo.userAnswer[i] && $this.questionInfo.userAnswer[i].value == newOption.options[j].name) {
                      match += "<span class='c-textAlign-c selectClass c-inlineblack c-w100' value=" + i + ">" + newOption.options[j].name + "</span>"
                        addSpane = false
                        break
                      } else {
                        addSpane = true
                      }
                  }
                }
                if (addSpane) {
                    match += "<span class='c-textAlign-c selectClass c-inlineblack c-w100'  value=" + i + ">" + (i + 1) + ". 点击答题</span>"
                }
              match += '</span>'
              return match
            })
            $this.$nextTick(function () {
                $this.bineSelect();
              })
            $this.clickShow = true
          }
        } if ($this.questionInfo.type == 11 && $this.examModel == 2) {
          let str = $this.questionInfo.problem;
          // match 方法返回匹配的数组
          let res = str.match(/\{\{[\d}]*?\}\}/g);
          let count = !res ? 0 : res.length;
          if ($this.leftNumFlag == false && ($this.questionInfo.userAnswer == null || $this.questionInfo.userAnswer || $this.questionInfo.userAnswer.length == 0)) {
              $this.questionInfo.userAnswer = []
              for (let k = 0; k < count; k++) {
                $this.questionInfo.userAnswer[k] = {value : "", key : ""}
              }
          }
          if ($this.leftNumFlag == true) {
            for (let i = 0; i < count; i++) {
              $this.questionInfo.problem = $this.questionInfo.problem.replace(/\{\{[\d}]*?\}\}/, function() {
                // let match = "<span class='c-ww60 c-inlineblack selectClass' onclick='alert(111)'></span>"
                const newOption = $this.questionInfo.newOption[i]
                let addSpane = true
                let match = '<span name=' + count + ' class="c-inlineblack c-lh36 c-mh10 c-minw140 c-bd0 c-br0 c-fc-xblue c-textAlign-c c-ph10 c-p c-bg-white" style="text-align-last: center;font-size: 0.6rem;border-bottom:1px solid">'
                  for (let j = 0; j < newOption.options.length; j++) {
                    if (newOption != '' && newOption != null) {
                      if ($this.questionInfo.userAnswer[i] && $this.questionInfo.userAnswer[i].value == newOption.options[j].name) {
                        match += "<span class='c-textAlign-c selectClass c-inlineblack c-w100' value=" + i + ">" + newOption.options[j].name + "</span>"
                          addSpane = false
                          break
                        } else {
                          addSpane = true
                        }
                    }
                  }
                  if (addSpane) {
                      match += "<span class='c-textAlign-c selectClass c-inlineblack c-w100'  value=" + i + ">" + (i + 1) + ". 点击答题</span>"
                  }
                match += '</span>'
                return match
              })
              $this.$nextTick(function () {
                $this.bineSelect();
              })
            $this.clickShow = true
            }
          } else {
            for (let i = 0; i < count; i++) {
              $this.questionInfo.problem = $this.questionInfo.problem.replace(/\{\{[\d}]*?\}\}/, function() {
              // let match = "<span class='c-ww60 c-inlineblack selectClass' onclick='alert(111)'></span>"
              const newOption = $this.questionInfo.newOption[i]
              let addSpane = true
              let match = '<span name=' + count + ' class="c-inlineblack c-lh36 c-mh10 c-minw140 c-bd0 c-br0 c-fc-xblue c-textAlign-c c-ph10 c-p c-bg-white" style="text-align-last: center;font-size: 0.6rem;border-bottom:1px solid">'
                for (let j = 0; j < newOption.options.length; j++) {
                  if (newOption != '' && newOption != null) {
                    if ($this.questionInfo.userAnswer[i] && $this.questionInfo.userAnswer[i].value == newOption.options[j].name) {
                      match += "<span class='c-textAlign-c selectClass c-inlineblack c-w100' value=" + i + ">" + newOption.options[j].name + "</span>"
                        addSpane = false
                        break
                      } else {
                        addSpane = true
                      }
                  }
                }
                if (addSpane) {
                    match += "<span class='c-textAlign-c selectClass c-inlineblack c-w100'  value=" + i + ">" + (i + 1) + ". 点击答题</span>"
                }
              match += '</span>'
              return match
            })
            $this.$nextTick(function () {
                $this.bineSelect();
              })
              $this.clickShow = true
            }
          }
        }
        if ($this.examModel == 2) {
          if ($this.questionInfo.type == 4 || $this.questionInfo.smallType == 4 || ($this.questionInfo.type == 9 && $this.questionInfo.realType == 4)) {
            if ($this.questionInfo.userAnswer != null) {
              // if ($this.questionInfo.userAnswer == '1') {
                $this.userAnswer = $this.questionInfo.userAnswer == '1' ? '正确' : '错误'
              // } else if ($this.questionInfo.userAnswer == '-1') {
              //   $this.userAnswer = '错误'
              // }
            }
          } else {
            $this.userAnswer = $this.questionInfo.userAnswer
          }
        }
        if ($this.questionInfo.type == 1 || $this.questionInfo.type == 2 || $this.questionInfo.smallType == 1 || $this.questionInfo.smallType == 2 || ($this.questionInfo.type == 9 && ($this.questionInfo.realType == 1 || $this.questionInfo.realType == 2))) {
          if ($this.questionInfo.userAnswer != null) {
            for (let i = 0; i < $this.questionInfo.userAnswer.length; i++) {
              let ArrText = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'I', 'J']
              // let answercontant=$this.questionInfo.userAnswer[i]
              let arrindex = $this.questionInfo.userAnswer[i]
              console.log(ArrText.indexOf(arrindex), ArrText.lastIndexOf(arrindex))
              if (ArrText.indexOf(arrindex) != -1) {
                $this.answerList[ArrText.indexOf(arrindex)] = true;
                $this.optionClass[ArrText.indexOf(arrindex)] = 'choose';
              }
              // if ($this.questionInfo.userAnswer[i] == 'A') {
              //   $this.answerList[0] = true;
              //   $this.optionClass[0] = 'choose';
              // }
              // if ($this.questionInfo.userAnswer[i] == 'B') {
              //   $this.answerList[1] = true;
              //   $this.optionClass[1] = 'choose';
              // }
              // if ($this.questionInfo.userAnswer[i] == 'C') {
              //   $this.answerList[2] = true;
              //   $this.optionClass[2] = 'choose';
              // }
              // if ($this.questionInfo.userAnswer[i] == 'D') {
              //   $this.answerList[3] = true;
              //   $this.optionClass[3] = 'choose';
              // }
              // if ($this.questionInfo.userAnswer[i] == 'E') {
              //   $this.answerList[4] = true;
              //   $this.optionClass[4] = 'choose';
              // }
              // if ($this.questionInfo.userAnswer[i] == 'F') {
              //   $this.answerList[5] = true;
              //   $this.optionClass[5] = 'choose';
              // }
              // if ($this.questionInfo.userAnswer[i] == 'G') {
              //   $this.answerList[6] = true;
              //   $this.optionClass[6] = 'choose';
              // }
              // if ($this.questionInfo.userAnswer[i] == 'H') {
              //   $this.answerList[7] = true;
              //   $this.optionClass[7] = 'choose';
              // }
              // if ($this.questionInfo.userAnswer[i] == 'I') {
              //   $this.answerList[8] = true;
              //   $this.optionClass[8] = 'choose';
              // }
              // if ($this.questionInfo.userAnswer[i] == 'J') {
              //   $this.answerList[9] = true;
              //   $this.optionClass[9] = 'choose';
              // }
            }
          }
        } else if ($this.questionInfo.type == 4 || $this.questionInfo.smallType == 4 || ($this.questionInfo.type == 9 && $this.questionInfo.realType == 4)) {
          if ($this.questionInfo.userAnswer != null) {
            if ($this.questionInfo.userAnswer == '1') {
              $this.answerList[0] = true;
              $this.optionClass[0] = 'choose';
            } else if ($this.questionInfo.userAnswer == '-1') {
              $this.answerList[1] = true;
              $this.optionClass[1] = 'choose';
            }
          }
        }
        if ($this.questionInfo.type == 3 || $this.questionInfo.smallType == 3 || ($this.questionInfo.type == 9 && $this.questionInfo.realType == 3)) {
          if ($this.questionInfo.userAnswer != null) {
            $this.essayAnswer = $this.questionInfo.userAnswer
          } else {
            $this.essayAnswer = ''
          }
          $this.clickShow = true
          if ($this.questionInfo.imgArr && $this.questionInfo.imgArr.length > 0) {
            for (let item of $this.questionInfo.imgArr) {
              let urlObj = {
                url: item.url
              };
              $this.uploadImgList.push(urlObj);
            }
          }
        }
        if ($this.questionInfo.type == 5 || $this.questionInfo.smallType == 5 || ($this.questionInfo.type == 9 && $this.questionInfo.realType == 5)) { //填空题
          $this.clickShow = true
          let _obj = JSON.stringify($this.questionInfo.answer); //深拷贝出来处理，不影响原数据
          if ($this.questionInfo.userAnswer == null || ($this.questionInfo.userAnswer.length == 1 && $this.questionInfo.userAnswer[0].value == '')) {
            $this.fbAnswer = JSON.parse(_obj);
            $this.fbAnswer.forEach(item => {
              item.value = "";
            })
          } else {
            let _obj2 = JSON.stringify($this.questionInfo.userAnswer);
            $this.fbAnswer = JSON.parse(_obj2);
          }
        }
        if ($this.questionInfo.type == 9) {
          if ($this.smallNumber == 1) {
            $this.moreQue = true
          }
          if ($this.questionInfo.status != -1) {
            moreTimeControl = setTimeout(() => {
              if (!!$this.$refs.bigProblem && $this.$refs.bigProblem.offsetHeight < 80) {
                $this.showmoTest = false
              } else {
                $this.showmoTest = true
              }
            }, 400)
          }
          // $this.$nextTick(function () {
          //   if (!!$this.$refs.bigProblem && $this.$refs.bigProblem.offsetHeight < 80) {
          //     $this.showmoTest = false
          //   } else {
          //     $this.showmoTest = true
          //   }
          // })
          $this.isOver = (($this.num == $this.wholeNum) && ($this.hasSmallNum == $this.smallNumber)) ? 1 : 0;
        } else {
          $this.isOver = $this.num < $this.wholeNum ? 0 : 1;
        }
        if (($this.examModel == 2 && $this.leftNumFlag == true)) {
          $this.setAnalysisStyle($this.userAnswer, $this.questionInfo.answer);
          $this.showAnalysis = true;
        }
        $this.getAnswerSheet()

        if ($this.questionInfo.isTimeEndFinishExam == 1) {
          $this.timeOutNum = 2
          clearInterval(isTimeEndControl)
          isTimeEndControl = setInterval(() => {
            $this.isTimeUp = true;
            $this.clickNextQuestion(3, 0)
             $this.showTimeEnd = true
             console.log($this.timeOutNum, 'isTimeEndFinishExam')
            if ($this.timeOutNum == 0) {
              clearInterval(isTimeEndControl)
              isTimeEndControl = null
              $this.$routerGo($this, "replace", {
                path: "/homePage/examination/examinationResult",
                query: {
                  paperMainId: $this.paperMainId,
                  topicId: $this.topicId,
                  isRelevance: $this.isRelevance,
                  entyCenter: $this.entyCenter,
                  ttId: $this.ttId,
                  tpId: $this.tpId,
                  tlId: $this.tlId,
                  progress: $this.progress,
                  duration: curanswerTime
                }
              });
            }
            $this.timeOutNum--
          }, 1000)
        }
      });
    },
    closeGuidePop() {
      this.$routerGo(this, "replace", {
        path: "/homePage/examination/examinationResult",
        query: {
          paperMainId: this.paperMainId,
          topicId: this.topicId,
          isRelevance: this.isRelevance,
          entyCenter: this.entyCenter,
          ttId: this.ttId,
          tpId: this.tpId,
          tlId: this.tlId,
          progress: this.progress,
          duration: curanswerTime
        }
      });
    },
    bineSelect() {
      let btn = document.getElementsByClassName('selectClass')
      Array.from(btn).forEach(element => {
        element.addEventListener('click', this.getSelect);
      });
    },
    getSelect(event) {
      var currentTarget = event.currentTarget; // 指向添加监听器的元素
      this.selectIndex = currentTarget.getAttribute('value'); // 获取其属性
      this.answerList = [false, false, false, false, false, false, false, false, false, false];
      this.optionClass = ['noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose', 'noChoose'];
      console.log(this.userAnswer, 'userAnswer')
      if (this.userAnswer) {
        if (this.userAnswer[this.selectIndex].value == 'A') {
          this.answerList[0] = true;
          this.optionClass[0] = 'choose';
        }
        if (this.userAnswer[this.selectIndex].value == 'B') {
          this.answerList[1] = true;
          this.optionClass[1] = 'choose';
        }
        if (this.userAnswer[this.selectIndex].value == 'C') {
          this.answerList[2] = true;
          this.optionClass[2] = 'choose';
        }
        if (this.userAnswer[this.selectIndex].value == 'D') {
          this.answerList[3] = true;
          this.optionClass[3] = 'choose';
        }
        if (this.userAnswer[this.selectIndex].value == 'E') {
          this.answerList[4] = true;
          this.optionClass[4] = 'choose';
        }
        if (this.userAnswer[this.selectIndex].value == 'F') {
          this.answerList[5] = true;
          this.optionClass[5] = 'choose';
        }
        if (this.userAnswer[this.selectIndex].value == 'G') {
          this.answerList[6] = true;
          this.optionClass[6] = 'choose';
        }
        if (this.userAnswer[this.selectIndex].value == 'H') {
          this.answerList[7] = true;
          this.optionClass[7] = 'choose';
        }
        if (this.userAnswer[this.selectIndex].value == 'I') {
          this.answerList[8] = true;
          this.optionClass[8] = 'choose';
        }
        if (this.userAnswer[this.selectIndex].value == 'J') {
          this.answerList[9] = true;
          this.optionClass[9] = 'choose';
        }
      }
      this.showSelectModal = true
    },
     //开始播放音频
    audioCanPlay(e) {
      isCanPlay = true;
      this.duration = Math.floor(e.target.duration);
      this.duration = Math.floor(document.getElementById('audio').duration)
      this.playtotalTime = this.timeToStr(this.duration)
      console.log("audioCanPlay-----------");
    },
    ancyAudioCanPlay(e) {
      ancyisCanPlay = true;
      this.ancyduration = Math.floor(e.target.duration);
      this.ancyduration = Math.floor(document.getElementById('ancyaudio').duration)
      this.ancyplaytotalTime = this.timeToStr(this.ancyduration)
    },
    audioTimeUpdate() {
      // //如果正在拖动  还不能播放，则不更新时间
      if (this.dragFlag && !isCanPlay) {
        return;
      }
      playTimeControl = setTimeout(() => {
        if (document.getElementById('audio') && Math.floor(document.getElementById('audio').currentTime) > 0) {
          this.audioPlayTime = Math.floor(document.getElementById('audio').currentTime);
          this.playtime = this.timeToStr(this.audioPlayTime)
        }
      }, 200)
      console.log("audioTimeUpdate-----------");
    },
    ancyAudioTimeUpdate() {
      // //如果正在拖动  还不能播放，则不更新时间
      if (this.ancydragFlag && !ancyisCanPlay) {
        return;
      }
      ancyplayTimeControl = setTimeout(() => {
        if (document.getElementById('ancyaudio') && Math.floor(document.getElementById('ancyaudio').currentTime) > 0) {
          this.ancyaudioPlayTime = Math.floor(document.getElementById('ancyaudio').currentTime);
          this.ancyplaytime = this.timeToStr(this.ancyaudioPlayTime)
        }
      }, 200)
    },
    dragStart() {
      this.dragFlag = true;
    },
    ancydragStart() {
      this.ancydragFlag = true;
    },
    inputChange() {
      console.log("inputChange-----------");
      if (this.dragFlag) {
        this.dragFlag = false;
        return;
      }
      document.getElementById('audio').currentTime = this.audioPlayTime;
    },
    ancyinputChange() {
      console.log("inputChange-----------");
      if (this.ancydragFlag) {
        this.ancydragFlag = false;
        return;
      }
      document.getElementById('ancyaudio').currentTime = this.ancyaudioPlayTime;
    },
    dragging() {
      this.dragFlag = true;
      clearInterval(playTimeControl);
      console.log("dragging------");
    },
    ancydragging() {
      this.ancydragFlag = true;
      clearInterval(ancyplayTimeControl);
      console.log("dragging------");
    },
    //拖动结束，更改播放器当前时间，重新开始循环获取当前时间
    dragEnddragEnd() {
      document.getElementById('audio').currentTime = this.audioPlayTime;
      this.dragFlag = false;
      console.log("dragEnd-----------");
    },
    //拖动结束，更改播放器当前时间，重新开始循环获取当前时间
    ancydragEnddragEnd() {
      document.getElementById('ancyaudio').currentTime = this.ancyaudioPlayTime;
      this.ancydragFlag = false;
      console.log("dragEnd-----------");
    },
    firstPlay() {
      this.showFirstSpeak = false;
      this.showLoudspeaker = true;
      this.playRadio();
      if (ancyPlayer) {
        ancyPlayer.pause();
      }
      if (document.getElementById("ancyaudio").src != '') {
        document.getElementById('ancyaudio').pause();
        this.ancyshowFirstSpeak = true
      }
    },
    ancyfirstPlay() {
      this.ancyshowFirstSpeak = false;
      this.ancyshowLoudspeaker = true;
      this.ancyplayRadio();
      if (player) {
        player.pause();
      }
      if (document.getElementById("audio").src != '') {
        document.getElementById('audio').pause();
        this.showFirstSpeak = true
      }
    },
    replay() {
      this.audioPlayTime = 0
      document.getElementById('audio').currentTime = this.audioPlayTime;
      this.showLoudspeaker = true;
      this.playRadio();
      if (ancyPlayer) {
        ancyPlayer.pause();
      }
      if (document.getElementById("ancyaudio").src != '') {
        document.getElementById('ancyaudio').pause();
        this.ancyshowFirstSpeak = true
      }
    },
    ancyreplay() {
      this.ancyaudioPlayTime = 0
      document.getElementById('ancyaudio').currentTime = this.ancyaudioPlayTime;
      this.ancyshowLoudspeaker = true;
      this.ancyplayRadio();
      if (player) {
        player.pause();
      }
      if (document.getElementById("audio").src != '') {
        document.getElementById('audio').pause();
        this.showFirstSpeak = true
      }
    },
    pause() {
      this.showFirstSpeak = true
      document.getElementById("audio").pause();
    },
    ancypause() {
      this.ancyshowFirstSpeak = true
      document.getElementById("ancyaudio").pause();
    },
    playRadio() {
      let audio = document.getElementById("audio");
      if (this.questionInfo.resourceType == 2 && this.questionInfo.resourceUrl != '') {
        if (this.isWeiXin) {
          try {
            document.addEventListener(
                "WeixinJSBridgeReady",
                function () {
                  document.getElementById("audio").play();
                },
                false
              );
              WeixinJSBridge.invoke("getNetworkType", {}, function (e) {// eslint-disable-line
                // 在这里拿到 e.err_msg, 这里面就包含了所有的网络类型
                document.getElementById("audio").play();
                console.log("WeixinJSBridgeWeixinJSBridgeWeixinJSBridgeWeixinJSBridge");
              });
          } catch (error) {
            // continue regardless of error
          }
        } else {
          audio.load();
          audio.play();
        }
      }
    },
    ancyplayRadio() {
      let audio = document.getElementById("ancyaudio");
      if (this.questionInfo.analysisRtype == 2 && this.questionInfo.analysisRurl != '') {
        if (this.isWeiXin) {
          try {
            document.addEventListener(
                "WeixinJSBridgeReady",
                function () {
                  document.getElementById("ancyaudio").play();
                },
                false
              );
              WeixinJSBridge.invoke("getNetworkType", {}, function (e) {// eslint-disable-line
                // 在这里拿到 e.err_msg, 这里面就包含了所有的网络类型
                document.getElementById("ancyaudio").play();
                console.log("WeixinJSBridgeWeixinJSBridgeWeixinJSBridgeWeixinJSBridge");
              });
          } catch (error) {
            // continue regardless of error
          }
        } else {
          audio.load();
          audio.play();
        }
      }
    },
    playAudioEnd() {
      this.showLoudspeaker = false;
    },
    ancyPlayAudioEnd() {
      this.ancyshowLoudspeaker = false;
    },
    onPlayTimeChange(playTime) {
      this.audioPlayTime = playTime;
    },
    ancyOnPlayTimeChange(playTime) {
      this.ancyaudioPlayTime = playTime;
    },
    playAudioError() {},
    ancyPlayAudioError() {},
    closeModal() {
      this.showModal = false
    },
    onConfirmOverLive() {
      let $this = this
      utilJs.postMethod(global.apiurl + 'exam/feedbackError', {
        paperMainId: $this.paperMainId,
        paperDetailId: $this.questionId,
        errContent:$this.errContent,
        testPaperType: $this.questionInfo.paperInfo.testPaperType
      },
        res => {
          $this.$showCjToast({
            text: res,
            type: "success"
          });
          $this.isFeedback = 1
          $this.closeModal()
        },
        () => {
        }
      )
    },
    wrongFeedback() {
      this.showModal = true
    },
    clickGoOn() {
      //点击继续
      this.isPause = false;
      clearInterval(aswerControl)
      this.aswerTimeControl();
      if (this.enableLimitTime != -1) {
        this.aswerTimeCountDown();
      }
    },
    clickRestart() {
      //点击重新开始1
      let $this = this;
      this.isPause = false;
      this.answerTime = "00:00:00";
      curanswerTime = 0;
      this.isOver = 0;
      this.num = 1;
      this.smallNumber = 1
      this.questionInfo = null;
      this.showStart = false;
      this.essayAnswer = "";
      this.fbAnswer = null;
      this.uploadImgList = [];
      this.showAnalysis = false;
      this.userAnswer = ''
      //    this.$refs.startAnimation.startCount();

      //    clearInterval(countDownControl);
      //    this.timeProcess = 100;
      //    this.countDownTime = 0;
      //    this.aswerTimeCountDown()
      utilJs.postMethod(global.apiurl + "paperLibrary/createExam", {
        paperMainId: this.paperMainId,
        topicId: this.topicId
      }, () => {
        $this.timeProcess = 100;
        countDownTime = 0;
        aswerControl = null
        countDownControl = null
        clearInterval(aswerControl);
        clearInterval(countDownControl);
        $this.getQuestion()
      })
    },
    clickExit() {
      //点击退出测试
      this.isPause = false;
      clearInterval(aswerControl);
      clearInterval(countDownControl);
      this.$router.go(-1);
    },
    // getResult(paperMainId, topicId) {
    //   let $this = this;
    //   utilJs.getMethod(global.apiurl + 'exam/completeTest/' + paperMainId + '?topicId=' + topicId, function (res) {
    //     $this.hasCommit = false;
    //     //      $this.testRes.courseInfo = {};
    //     //      $this.testRes.courseInfo.courseAvatar = '';
    //     $this.testRes = res;
    //     if ($this.testRes.isRemark != -1) {
    //       $this.review = $this.testRes.remark;
    //     } else {
    //       $this.review = '';
    //     }
    //   });
    //   //获取答题卡数据
    //   utilJs.getMethod(global.apiurl + 'exam/answerCard/' + paperMainId + '?topicId=' + topicId, function (res) {
    //     $this.hasCommit = false;
    //     $this.answerCardList = res.answerSheet;
    //     for (let i = 0; i < res.notAnswerNum; i++) {
    //       $this.answerCardList.push('');
    //     }
    //   });
    // },
    onTestAgain() {
      this.hasCommit = false;
      this.showStart = false;
      this.answerTime = "00:00:00";
      curanswerTime = 0;
      this.pauseTimeControl();
      this.num = 1;
      this.answerList = [false, false, false, false, false, false, false, false, false, false];
      this.isOver = 0;
      this.questionInfo = null;
      this.essayAnswer = "";
      this.fbAnswer = null;
      this.uploadImgList = [];
      let $this = this;
      utilJs.getMethod(global.apiurl + 'paperLibrary/createExam/' + this.paperMainId + '?topicId=' + this.topicId + '&ckFrom=2', function () {
             $this.getQuestion();
        $this.showResult = false;
        $this.showStart = false;
        // $this.$refs.startAnimation.startCount();
      })
    },
    onAnalysis() {
      this.$routerGo(this, "push", {
        path: '/homePage/examination/examinationAnswerAnalyze',
        query: { paperMainId: this.paperMainId, topicId: this.topicId }
      });
    },
    onRanking() {
      this.$routerGo(this, "push", {
        path: '/homePage/examination/examinationRank',
        query: { paperMainId: this.paperMainId }
      });
    },
    onExamShare() {
      this.$routerGo(this, "push", {
        path: '/homePage/examination/examinationSpread',
        query: { paperMainId: this.paperMainId, topicId: this.topicId }
      });
    },
    showMoreQue() {
      this.moreQue = !this.moreQue
    },
    showAnswer() {
      if (this.showAnalysis == false) {
        let fbComplete = false;
        if (this.questionInfo.type == 5 || this.questionInfo.smallType == 5 || (this.questionInfo.type == 9 && this.questionInfo.realType == 5)) {
          this.fbAnswer.forEach(item => {
            if (item.value.trim() == "") {
              fbComplete = true;
            }
          })
        }
        this.userAnswer = this.transAnswerText();
        if (this.questionInfo.type == 11) {
          this.userAnswer.forEach(item => {
            if (item.value.trim() == "") {
              fbComplete = true;
            }
          })
        }
        // if (this.questionInfo.type == 3 || this.questionInfo.smallType == 3 || (this.questionInfo.type == 9 && this.questionInfo.realType == 3)) {
        //   if (this.userAnswer && this.userAnswer != "") {
        //     this.leftNumFlag = true
        //   }
        // }
        if (this.questionInfo.type != 9) {
          if (((this.questionInfo.type != 11 && this.questionInfo.type != 5 && this.questionInfo.smallType != 5) && this.userAnswer.trim() == "") || ((this.questionInfo.type == 5 || this.questionInfo.smallType == 5) && fbComplete) || ((this.questionInfo.type == 11) && fbComplete)) {
            this.$showCjToast({
              text: (this.questionInfo.type <= 2 || (this.questionInfo.smallType > 0 && this.questionInfo.smallType <= 2)) ? "请选择答案" : "请填写答案",
              type: "warn"
            });
          } else {
              this.setAnalysisStyle(this.userAnswer, this.questionInfo.answer);
            // }
            this.showAnalysis = true;
            clearInterval(countDownControl);
          }
        } else {
          if ((this.questionInfo.realType != 5 && this.questionInfo.smallType != 5 && this.userAnswer.trim() == "") || (this.questionInfo.realType == 5 && fbComplete)) {
            this.$showCjToast({
              text: this.questionInfo.realType <= 2 ? "请选择答案" : "请填写答案",
              type: "warn"
            });
          } else {
              this.setAnalysisStyle(this.userAnswer, this.questionInfo.answer);
            this.showAnalysis = true;
            clearInterval(countDownControl);
          }
        }
      }
    },
    //分享
    wechatShare: function () {
      let title = this.examinationInfo.shareTitle;
      let shareImg = this.examinationInfo.sharePic || require('../../../assets/examination_defult.png');
      let shareDesc = this.examinationInfo.shareDesc;//"共包含"+this.examinationInfo.hasPaper+"套考卷";
      let shareUrl = ''
      if (this.topicId) {
        shareUrl = `${window.location.href.split("#")[0]}#/homePage/examination/examinationDetail?ExaminationNo=${this.topicId}&refereeId=${localStorage.getItem("userId")}`;
      } else {
        shareUrl = `${window.location.href.split("#")[0]}#/homePage/testPaper/testDetail?testId=${this.paperMainId}&refereeId=${localStorage.getItem("userId")}`;
      }
      utilJs.wechatConfig(shareUrl, title, shareImg, shareDesc, function () { }, true);
    },
    //手机端分享
    appShare: function () {
      let title = this.examinationInfo.shareTitle;
      let shareImg = this.examinationInfo.sharePic || require('../../../assets/examination_defult.png');
      let shareUrl = ''
      if (this.topicId) {
        shareUrl = window.location.href.split("#")[0] + '#/homePage/examination/examinationDetail?ExaminationNo=' + this.topicId + '&refereeId=' + localStorage.getItem("userId");
      } else {
        shareUrl = `${window.location.href.split("#")[0]}#/homePage/testPaper/testDetail?testId=${this.paperMainId}&refereeId=${localStorage.getItem("userId")}`;
      }

      var shareDesc = this.examinationInfo.shareDesc;
      utilJs.appShareTrue(title, shareImg, shareUrl, shareDesc);
    }
  },
  beforeRouteLeave(to, from, next) {
    if (player) {
      destoryPlayer(player);
      player = null;
      // document.querySelector("#liveVideoIntroParent").innerHTML = "";
    }
    if (ancyPlayer) {
      destoryPlayer(ancyPlayer);
      ancyPlayer = null;
      // document.querySelector("#liveVideoIntroParent").innerHTML = "";
    }
    console.log('路由离开')
    clearInterval(aswerControl);
    clearInterval(countDownControl);
    next();
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

<style scoped>
.btn-wrap {
  position: fixed;
  bottom: 1.5rem;
  z-index: 2;
}
.btn-next-question {
  text-align: center;
  border-radius: 0.9rem 0px 0px 0.9rem;
  box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.05);
}
.btn-befor-question {
  text-align: center;
  border-radius: 0px 0.9rem 0.9rem 0px;
  box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.05);
}
.btn-pause {
  font-size: 0.8rem;
  width: 7.5rem;
  height: 2rem;
  line-height: 2rem;
  text-align: center;
  border-radius: 1rem;
  border: 1px solid #999;
  background-color: #fff;
  margin: 1.65rem auto 0 auto;
}
.op-type {
  flex-shrink: 0;
}
.c-mh90 {
  min-height: 2.25rem;
}
.time-bg-bar {
  height: 2px;
  position: relative;
  background: #6c83ff;
}
.time-bar {
  height: 2px;
  position: absolute;
  top: 0;
  right: 0;
  background-color: #e2e2e2;
}
.c-mr68 {
  margin-right: 1.7rem;
}
.noChoose {
  border: 1px solid #e5e5e5;
}
.choose {
  color: #fff;
  background-color: #6c83ff;
}
.analysisTypeRight {
  background: #39C564;
  color: #fff;
}
.right {
  color: #39C564;
}
.worron {
  color: #FF0000;
}
.borderRight {
  border: 1px solid #39C564;
  background-color: rgba(113, 219, 119, 0.1);
}
.borderUser {
  border: 1px solid #FF0000;
  background-color: rgba(255, 0, 0, 0.1);
}
.analysisTypeUser {
  background: #FD6167;
  color: #fff;
}
.analysisRight {
  border: 2px solid #39C564;
  background-color: rgba(113, 219, 119, 0.1);
}
.analysisUser {
  border: 2px solid #FF0000;
  background-color: rgba(255, 0, 0, 0.1);
}
.c-fc-1b {
  color: #1b1b1b;
}
.c-text-indent50 {
  text-indent: 1.25rem;
}
input[type="text"],
input[type="button"],
input[type="submit"],
input[type="reset"] {
  -webkit-appearance: none;
}
textarea {
  box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
  -webkit-appearance: none;
}
.c-ww54 {
  width: 1.35rem;
}
.short-answer-textarea {
  height: 5.75rem;
  outline: none;
  border: none;
  -webkit-appearance: none;
  resize: none;
}
.c-bd1-ed {
  border: 1px solid #ededed;
}
.c-bd1-d7 {
  border: 1px solid #d7d7d7;
}
.del-img {
  position: absolute;
  top: -0.4rem;
  right: -0.2rem;
  cursor: pointer;
  font-size: 0.8rem;
  color: #3d3d3d;
}
.orange-opa {
  color: rgba(255, 120, 0, 0.6);
}
.bg-fa {
  background-color: #fafafa;
}
.bd-xblue {
  border: 1px solid #2194ff;
}
.bg-e6 {
  background-color: #e6e6e6;
}
.bg-lineargradient {
  background: linear-gradient(
    90deg,
    rgba(154, 170, 255, 1),
    rgba(108, 131, 255, 1)
  );
}
.c-bg-time {
  background: rgba(108, 131, 255, 0.1);
}
.chanDeg {
  display: inline-block;
  transform: rotate(180deg);
}
.maxMask {
  mask-image: linear-gradient(
    to top,
    rgba(255, 255, 255, 0) 0,
    rgba(255, 255, 255, 0.7) 10%,
    rgba(255, 255, 255, 1) 15%,
    rgba(255, 255, 255, 1) 100%
  );
}
.chanDeg90 {
  transform: rotate(90deg);
  display: inline-block;
}
.chanDeg-90 {
  transform: rotate(-90deg);
  display: inline-block;
}
.examAnswer img {
  display: inline;
  vertical-align: middle;
}
.Analysis img {
  display: block;
}
.c-whiteOpcity03 {
  background: rgba(255, 255, 255, 0.3);
}
.dot-peinner {
  position: relative;
  background: rgba(255, 255, 255, 1);
}
.audioPlay /deep/ .vue-slider-dot {
  width: auto !important;
  height: auto !important;
}
#liveVideoIntroParent {
  width: 100% !important;
}
#ancyVideoIntroParent {
  width: 100% !important;
}
.input-nikename {
  -webkit-appearance: none;
  background: none;
  border: 1px solid #e5e5e5;
}
.closeBig >>> p > img,
.closeBig >>> section > img,
.closeBig >>> div > img,
.closeBig >>> img {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}
.aCloseBig >>> p > a > img,
.aCloseBig >>> section > a > img,
.aCloseBig >>> div > a > img {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}
.problemdDom /deep/ img{
  display: inline-block;
  vertical-align: middle;
}
.problemdDom /deep/ p{
  text-align: left!important;
}
.problemdDom /deep/ .wscnph{
  display: block;
}
.problemdDom /deep/ p img{
  display: block;
}
.rightClass{
  color: #6c83ff;
}
.box {
  box-sizing: border-box;
  position: relative;
}
.wifi-symbol {
  width: 1rem;
  height: 1rem;
  overflow: hidden;
  position: relative;
  transform: rotate(135deg);
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transform: translate3d(135deg,0,0);
  -webkit-backface-visibility: hidden;
}
.wifi-circle {
  /* border: 0.1rem solid #999999; */
  border-radius: 50%;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  position: absolute;
  -webkit-transform: translate3d(0,0,0);
}

.first {
  width: 0.1rem;
  height: 0.1rem;
  background: #cccccc;
  top: 0.9rem;
  left: 0.9rem;
}
.second {
  width: 0.5rem;
  height: 0.5rem;
  top: 0.7rem;
  left: 0.7rem;
}
.seconAnimation{
  animation: fadeInOut 1s infinite 0.2s;
}
.third {
  width: 0.8rem;
  height: 0.8rem;
  top: 0.5rem;
  left: 0.5rem;
}
.thirdAnimation{
  animation: fadeInOut 1s infinite 0.4s;
}
@keyframes fadeInOut {
    0% {
        opacity: 0; /*初始状态 透明度为0*/
    }
    100% {
        opacity: 1; /*结尾状态 透明度为1*/
    }
}
.input-overIpt {
  /* border: none;
  -webkit-appearance: none; */
  border: 1px solid #e5e5e5;
}
.iptClass{
  background: #F2F3F2;
  border: 2px solid #F2F3F2;
}
.textarea {
  font-size: 0.6rem;
  outline: none;
  border: none;
  width: 100%;
  height: 2rem;
  background: none;
  -webkit-appearance: none;
  resize: none;
  padding: 0.6rem 0;
}
.textarea:focus {
  outline: none;
}
.textarea::-webkit-input-placeholder {
  color: #999;
}
.c-mt-36{
  margin-top: -0.9rem;
}
.c-mt-t-100{
  margin-top: -2.5rem;
}
</style>
